Add margin to a specific unordered list

[pittles78]

How can I target a specific ul to have a bottom margin. See page here:

http://superluxescreenprinting.com/privacy-policy/

I want those list items spaced, but I don’t want the css to effect my top nav menu.

I think I would use a class, but I don’t fully understand that.

Please help,
Jon

[Senff]

In this case, you could target the list in the content part of the site (and not the nav menu) by doing this:

.row ul {
    margin-bottom:20px;
}

Keep in mind that will then add a bottom margin to every list you have in the content of the site.

If you just need to add margin to that particular list and nothing else, indeed you should give the list a class in the HTML, like this:

<ul class="awesome-list">
    <li> Before blah blah blah.... </li>
    <li> We will etc. etc. </li>
    ....

And then add the margin in your CSS like this:

ul.awesome-list {
    margin-bottom:20px;
}

[pittles78]

Thank you Senff. I tried your bottom selection and I am missing something because it isn’t working for me. Is there something else to add?

Best,
Jon

[Paulie_D]

If you want the list items spaced then

ul.awesome-list li {
margin-bottom: 20px; <== your number here
}

[Senff]

Indeed, there IS a bottom margin to the UL now, so you did right. I’m confused cause you asked:

How can I target a specific ul to have a bottom margin.

This is what my suggestion did. But later on you state:

I want those list items spaced,

And that’s where you have to use @Paulie_D’s code.

[pittles78]

Oh, ok. Thank you guys. That makes sense.

Best,
Jon

[Author]

Posts