Conditional CSS is a server side script which allows you to target particular browsers within your CSS files. The script detects a visitor’s browser and then parses your css files, removing the conditional statements and any lines that aren’t meant to go to that browser. I think I like this more than traditional browser filters but less than using conditional comments to serve an extra stylesheet with overrides to Internet Explorer. I haven’t tested it to determine how much of an issue the additional processing overhead is, so I’m not sure how usable it is. It’s an interesting technology and is available for multiple platforms including PHP and C. The C version is apparently very fast.
Tag Archives: CSS
Keep Your Myspace Comments In Line
Here’s a quick tip to keep the comments on your Myspace page from breaking your carefully constructed (or haphazardly thrown together) layout. This CSS will create a scroll bar for comments that are too wide for the comment column (images, videos, web addresses, etc…) To get it to work, stick it in the “About Me” section or anywhere else you can enter profile styles.
<style type="text/css">
/* keep comments in line */
table table table.friendsComments table table tr {
display: block;
width: 430px;
overflow: auto;
}
</style>
This will work in Firefox and should work in Internet Explorer 7, but I haven’t tested it yet. It won’t work in IE6, but it also won’t make your profile look any worse–it has no effect in that browser. For an example of this CSS in action you can check out my profile on Myspace.
Update: After further testing, I’ve found the following:
Works in: Recent versions of Firefox, Safari, and Opera
Doesn’t work in: Internet Explorer
I’ll make another update if I can get it working properly in IE. As before, using this code won’t make your profile look worse in IE, it just won’t make it better.