Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What is the scope of the * CSS hack?

I have been looking at a hack to solve a CSS problem I have. I haved used one to create a custom rule for Internet Explorer.

margin-top:45px;
*margin-top:0px;

Does this hack apply to all IE browsers? Does this hack appear in any versions of Firefox or Safari?

like image 873
Sam152 Avatar asked Mar 14 '09 12:03

Sam152


People also ask

What is scope in CSS?

The :scope CSS pseudo-class represents elements that are a reference point for selectors to match against. /* Selects a scoped element */ :scope { background-color: lime; } Currently, when used in a stylesheet, :scope is the same as :root , since there is not at this time a way to explicitly establish a scoped element.

Does CSS have scope?

CSS custom properties (also called CSS variables) already have scope. It is possible to redefine the value of a custom property for a specific element and its descendants.


1 Answers

This applies to IE7 and below. But be aware that this is not valid CSS, and it could break at any time. See here for a more comprehensive list of the various CSS hacks and which browsers they affect.

Although Internet Explorer 7 corrected its behavior when a property name is prefixed with an underscore or a hyphen, other non-alphanumeric character prefixes are treated as they were in IE6. Therefore, if you add a non-alphanumeric character such as an asterisk (*) immediately before a property name, the property will be applied in IE and not in other browsers. Unlike with the hyphen and underscore method, the CSS specification makes no reservations for the asterisk as a prefix, so use of this hack could result in unexpected behavior as the CSS specifications evolve.

I'd strongly recommend reconsidering whether you really need this hack, and if there isn't a better way to do what you want.

like image 61
John Feminella Avatar answered Oct 16 '22 13:10

John Feminella