:last-child not working when I add elements after it

Question

I have this code that consists of 5 uls in a div. I also have a piece of CSS that changes the last child's bottom margin. I have #divid ul:lastchild{margin-bottom: 10px;}, and it works, but when I add more divs after the last ul it doesn't.

<div id="divid">
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
    <ul>
</div>

#divid ul:lastchild {
    margin-bottom: 10px;
}

Answer 1

Use last-of-type if you wan't to style last ul no matter if it's actually the last element within its parent.

#divid ul:last-of-type {
    margin-bottom: 10px;
}