Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Problems grouping and nesting selectors Reply To: Problems grouping and nesting selectors

#157867
magicspon
Participant

I don’t know that there is a limit on the number of classes that can be grouped. But if you’ve got shed loads of classes grouped it might make more sense to just create a new class and add that to your html.

As far as nesting goes, again I don’t know that there is a limit with either Sass or Less. However it is recommended that you don’t nest more than three levels. ie.

#onecolnavigation {
    #navigation  {
        a:link,
        a:visited,
        a:hover,
        a:active {
            /* display: block; */
            text-decoration: none;
            text-align: center;
            line-height:2;
            padding:3px;
            transition: background 1.5s, color 1.5s;
            -webkit-transition: background 1.5s, color 1.5s;
            -moz-transition: background 1.5s, color 1.5s;
            -o-transition: background 1.5s, color 1.5s; border-radius:0.5em;
        }
        a:link,
        a:visited {
            color: #fff;
            background: #A82D37;
        }
        a:hover,
        a:active {
            color: #A82D37;
            background: #8DBDE0;
        }
    }
}