On 1 Oct 2013, at 16:50, Robert A. Rosenberg wrote:

So you are saying that in a 'class="c2 c1"' case, it scans the CSS defs,
> sees .c1 and applies it, keeps going and sees .c2 which overrides the c1
> width?
>
> IOW: The order that you list the class in the HTML is ignored and only the
> order that the classes are defined in the CSS defs counts.
>

On Wed, Oct 2, 2013 at 9:17 AM, Eric A. Meyer <[email protected]> wrote:

> That's correct.



(Assuming the selectors have the same origin, weight, AND specificity, that
> is; in that case, then the order the rules are listed in the CSS matters.
>  If two selectors don't have the same origin, weight, OR specificity, then
> the order they're listed in the CSS is irrelevant.)



Pertaining to origin, it's worth pointing out that the cascade also applies
when attaching external assets to a document:

HTML:

<!-- Identical selectors in both css files, the selector in other.css will
win [!] -->
<link rel="stylesheet" href="one.css">
<link rel="stylesheet" href="other.css">

<!-- Flip the order and now the selector in one.css wins -->
<link rel="stylesheet" href="other.css">
<link rel="stylesheet" href="one.css">

CSS:

// Same with CSS imports
@import url("other.css");
@import url("one.css"); <-- winning


[!] unless the nuclear option !important is used in one but not the other


-- 
Jon Reece
[email protected]
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to