how to clear the last <li> tag within a <ul>

Question

I know this is pretty basic, but it is giving me hangups. I have a basic list:

<ul>
    <li><a href="#">Insert Link Here</a></li>
    <li><a href="#">Insert Link Here</a></li>
    <li><a href="#">Insert Link Here</a></li>
</ul>

What do I need to do to make sure the last <li> item gets cleared? I've tried adding style="clear:both" to the end with no avail. Also I've added a 'div' after the last <li> tag before the closing </ul> tag, that works, but I know it doesn't validate.

Answer 1

If you want to have the background behind a block item which has only floated items inside, then:

ul {
  overflow: auto;
}