JohnAlbin / normalize-scss

This is the Sass version of Normalize.css, a collection of HTML element and attribute rulesets to normalize styles across all browsers.
https://github.com/JohnAlbin/normalize-scss#latest-versions
MIT License
1.44k stars 254 forks source link

Removed margins from ul ul #10

Closed LimeBlast closed 11 years ago

LimeBlast commented 11 years ago

Much like with my other pull request, I could be barking up the wrong tree here, but I figured, for code such as the example below, this would prevent huge, unneeded, margins on each of the inner lists:

<ul>
    <li>TV Series
        <ul>
            <li>TV Series DVD</li>
            <li>TV Series Bluray</li>
        </ul>
    </li>
    <li>Movies
        <ul>
            <li>DVD Movies</li>
            <li>Bluray Movies</li>
        </ul>
    </li>
    <li>Games
        <ul>
            <li>PC
                <ul>
                    <li>Download from Steam</li>
                    <li>Physical Media</li>
                </ul>
            </li>
            <li>Xbox 360</li>
            <li>Playstation 3</li>
        </ul>
    </li>
</ul>

(Or maybe this should be submitted to the original normalize.css project, I don't know)

oli commented 11 years ago

@LimeBlast out of curiosity, are you seeing this problem in actual browsers? I ask because afaik all user agent stylesheets already have default rules for preventing this. If you plan to do this in a non-Normalize project, using li ul, li ol {…} would also work better for you.

HTH

LimeBlast commented 11 years ago

Using this stylesheet, yes it is, because the upper and lower margin are specifically set, without removing them from nested lists.

oli commented 11 years ago

@LimeBlast Have you tested this? If so, what browser are you seeing this in? User agent stylesheet rules for nesting should have greater specificity than the rules in Normalize. For example Chrome has these rules:

ol ul, ul ol, ul ul, ol ol {
-webkit-margin-before: 0px;
-webkit-margin-after: 0px;
}

(They should use li ol, li ul too :wink:)

LimeBlast commented 11 years ago

Yes I tested it, that's how I knew it was a problem. I can't remember exactly which browsers, but most likely Firefox and/or Chrome.

oli commented 11 years ago

@LimeBlast My mistake, you’re right— this does override user agent styles. @JohnAlbin’s addition of vertical rhythm on #L341 is causing it. Interestingly it’s also visible in Normalize v1, where it’s intended behavior as per necolas/normalize.css#57.

JohnAlbin commented 11 years ago

This is related to #13.