what is the difference between width/margin and _width/_margin?

Question

.pageWidth
{
margin: 0 30px;
min-width: 940px;
_width: 976px;
_margin: 0 auto;

}

I saw this from a website css file. My question is: what is the difference between width/margin and _width/_margin? why use _width/_margin here?

Answer 1

It is a hack for IE6. The CSS rules _margin and _width will only apply for that browser. There are more curious hacks for the IE browser like:

width: 940px\9; /* IE8 and below */  
*width : 960px; /* IE7 and below */  

If you make a fast search in google for "IE CSS hacks" you can find more information and tricks for CSS rules in the evil IE like: Quick Tip: How to Target IE6, IE7, and IE8 Uniquely with 4 Characters

Answer 2

the _ and - before the properties is for compliance to Internet Explorer 6 and below. Here is the article for your reference:

http://www.javascriptkit.com/dhtmltutors/csshacks3.shtml

*Prefixing a regular property name with _ or - will cause the property to be applied to Internet Explorer 6 and below but generally not in other browsers.*

Answer 3

It's an old CSS hack used to target Internet Explorer. IE tries to be smart and does some additional parsing over the CSS properties one of which is stripping the underscores.

So in you case IE will override the width to 976px and for the rest of the browsers the width will stay 940px. This was used in the past to fix a problem with the IE broken box model, which didn't follow the W3C conventions.