I just recently found this out and it’s pretty cool so I have to share. When dealing with browser compatibility of CSS I used to have an IF statement in the HTML that would call for the appropriate CSS file according to the browser that is displaying the page. Well, I found a trick on how to keep all the class or id attributes together so it’s easy to find and adjust later.
The trick is you can use the pound sign (#) and underscore character (_) to comment out attributes for IE7, IE6 and FireFox.
The FireFox sees # and _ to be comment characters, Internet Explorer 6 sees # as comment character, Internet Explorer 7 sees _ as a comment. So if you build your CSS statement like the folowing example you should be able to please all 3 browsers. And this is great when dealing with paddings and margins, since Firefox and IE do not agree on these two.
------------------------------------------------------------------------------------------
Example:
#divid {
padding: 0px 0 20px 40px; /* All browsers see this */
#padding:0px; /* FireFox will not see this but IE7 & IE6 will */
#margin: 20px 0 0 40px; /* FireFox will not see this but IE7 & IE6 will */
_margin: 10px 0 0 30px; /* FireFox and IE7 will not see this but IE6 will */
}
------------------------------------------------------------------------------------------
I have not tested it in other browsers like Opera and Safari but it does work really good FireFox and IE’s. Let us know if this works for you or not.
Wednesday, April 29, 2009
Subscribe to:
Post Comments (Atom)
0 comments:
Post a Comment