CODEWITHSUNDEEP
css
AllisonC
AllisonC

Reputation: 3099

Does the minus sign or underscore in css do anything?

This question is similar to the one I asked here. I am cleaning up some files and I came across this in this css: 


.something
{
  height: 33px;
  -height: 34px; /* does this do anything?? /
}
and 

.something
{
  _width: 150px; / does this do anything?? */
}

EDIT: Okay, so the _ (underscore) is a css hack for IE, which is fine, I'll just leave it, but what about the minus sign, does it do anything at all?

Also, we are not supporting anything below IE 7 anymore, so if anything is a hack for IE6 I can take it out.

Upvotes: 14

Views: 6163

Answers (4)

Marcel
Marcel

Reputation: 28087

Straight from the W3C CSS 2.1 Spec -

4.1.2.1 Vendor-specific extensions

In CSS, identifiers may begin with '-' (dash) or '_' (underscore). Keywords and property names beginning with '-' or '_' are reserved for vendor-specific extensions.

However that said, using an underscore to prefix a CSS property is a well known CSS hack to apply that rule for rendering in IE 6.

Since a CSS identifier can start with a '-' (dash) and be valid, this can be used to quickly comment out parts of CSS during development. For example in the CSS below, none of the properties will be set for h1 and only margin will be set for h2.

-h1 { color:blue; margin:2em; }
h2 { -color:pink; margin:2em; } /* property "-color" not valid */

Upvotes: 14

alex
alex

Reputation: 490323

It means the CSS property will be applied in IE 6 and below. It is a CSS hack.

A cleaner method of applying styles to different IEs is using conditional comments.

Upvotes: 2

Nivas
Nivas

Reputation: 18344

This is a CSS hack, to trick some browsers to use them (or not use them). This one is the Underscore Hack

Versions 6 and below of Internet Explorer recognize properties with this prefix (after discarding the prefix). All other browsers ignore such properties as invalid. Therefore, a property that is preceded by an underscore or a hyphen is applied exclusively in Internet Explorer 6 and below.

#elem {   
         width: [W3C Model Width];   
         _width: [BorderBox Model]; 
      }

This hack uses invalid CSS[3] and there are valid CSS directives to accomplish a similar result. Thus some people do not recommend using it. On the other hand this hack does not change the specificity of a selector making maintenance and extension of a CSS file easier.

CSS Hacks is one (not so elegant) technique of achieving same look and feel and across browsers.

Upvotes: 2

jncraton
jncraton

Reputation: 9132

I'm not sure about the minus sign, but the underscore is a hack to have a rule ignored in IE < 6.

http://wellstyled.com/css-underscore-hack.html

Upvotes: 2

Related Questions