Web Design Blog
Popular Posts
- Fonts on the web and a list of web safe fonts
- CSS Hack:Getting Safari to behave
- Top 10 search engine optimization techniques
- Top 10 job boards for freelance web designers
- Creating a photo gallery in CSS without tables
- Test IE5 or IE6 on your PC with IE7 installed
- CSS Trick: Target only IE with an if statement
- 8 job boards, for freelance web designers, that don't suck
- Open source Dreamweaver alternatives
Categories
Weekly CSS Trick: The IE underscore hack
Posted on Tuesday, July 24th, 2007 under CSS, browser news by Dustin Brewer.This week it is a hack that I am providing for everyone to enjoy, it allows you to easily add a quick style within your existing style sheet to target internet explorer. This can help so you don’t have to check your ie CSS file if is just a simple margin adjustment. Which as we all know internet explorer has some issues with, especially internet explorer 6. The underscore hack is pretty basic but I will go over the various uses for it and touch on what browsers it affects and which browsers ignore it.It used to be that underscores were illegal within CSS but since CSS 2.1 was released it is now accepted. Basically Internet Explorer will ignore the underscore and accept it as a regular CSS expression where as other browsers will ignore any CSS expressions that have an underscore in them. This makes a very quick and easy way to target internet explorer without any difficulty at all.
The browsers that are affected by this are IE6 and IE7, because IE5 adheres to older CSS specifications it actually ignores the underscore.
Listed below is an example of its use.
#element {height: 280px; _height: 280px;}
It is quite basic but can come in very handy for an easy alteration to target IE browsers when you only need to change some small information. This method is of course not recommended for any extended IE manipulations because you should use the [if ie] method for major changes. The reason for this is that you can separate your CSS out and take full advantage of style and structure separation.
Next week I will go over some ways to ensure that your divs are wrapping around your content and not stopping half way short. This can be a huge pain if your background color or image isn’t going to the bottom of your content. I have had this issue a few times in the past and at first it can be frustrating to discover the root cause.
Whats Next?
9 Responses to “Weekly CSS Trick: The IE underscore hack”
Leave a Reply
About Dustin Brewer
Dustin Brewer is a freelance web designer based out of Oklahoma City, OK passionate about web standards, and beautiful web design. Dustin Brewer has been in the web design industry for over 8 years through freelance and professional experience. If you are interested in hiring Dustin Brewer please visit the web design services page to find out more information. You can also checkout my web design portfolio.
Simple and to the point, I was actually searching for the trick to getcontent to wrap in a pinch.. the trick on the bottom paragraph.
Very cool. Simple and useful. Thanks for sharing.
I swear by this hack. It’s fast, simple, and easy to use. If you’re going to be doing extensive IE hacking, I would recommend using a condition if statement instead, otherwise you’ll have a tonne of redundant code that will mess up your perfect, valid css document when you run it through the W3C validator.
I just want to say that your my daily hero. I was trying all sorts of code to try to set up an IE7 specific code and this is the only one that actually worked. I just wish I had found this 4 hours ago…
Thanks for sharing that Dustin.
This is another non-standard CSS hack available to IE developers. The thing is, these hacks are getting closer to the end of their existence as for the start Microsoft announced ending expressions in Style Sheet stack on Thursday earlier this week.
A very nice move towards the standard-compliant browser.
Very nice hack.
Keep on good working
The underscore hack won’t work for me. Have no clue why, I think it’s because I’m using a drop down menu and requires an html code above the css.
You really should not use this hack (use hacks only as a last resort), as we’ll never know if a future browser will also parse rules hidden by the hack. Moreover, as someone states here (in a comment), “if a hack becomes popular and is in widespread use, it may actually hinder the creation of new browsers and/or CSS specs. If the W3C wanted to include a special ‘underscore syntax’ for one reason or another, it probably can’t because it would conflict with a popular hack and wreak havoc to many old pages in new browsers that try to follow the new spec. That’s more or less how we ended up with the Quirksmode mess.”
In short, use conditional comments to tackle IE6/7/8.
Underscore hack will effect only IE6 not IE7.