CODEWITHSUNDEEP
htmlcss
GibboK
GibboK

Reputation: 73908

How to apply CSS to nested Unordered Lists?

I have some nested unordered list, I need to apply my class ul-deactive to every element inside that div with tag <ul> <li> at any depth.

With my code I'm not able to make it work. Any idea what I'm doing wrong and how to fix it?

<div class="ul-deactive">
<ul>
    <li>a
        <ul>
            <li>a-1 </li>
            <li>a-2 </li>
        </ul>
    </li>
    <li>b
        <ul>
            <li>b-1 </li>
            <li>b-2 </li>
        </ul>
    </li>
</ul>


.ul-deactive ul li
{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
    color:Fuchsia;
}

Upvotes: 1

Views: 4063

Answers (2)

ThatMatthew
ThatMatthew

Reputation: 1248

The properties list-style-type, margin, and padding should be applied to the ul, not the li, like so:

.ul-deactive ul li
{
     color:Fuchsia;
} 

.ul-deactive ul
{
     list-style-type: none;
     padding: 0px;
     margin: 0px;
}

Upvotes: 3

checkenginelight
checkenginelight

Reputation: 1146

Try this css

.ul-deactive ul
{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

.ul-deactive ul li
{
    color:Fuchsia;
}

Upvotes: 1

Related Questions