Floated image to left of a ul is ignoring margin/padding

Question

I have a paragraph followed by an unordered list, with several list items. I also have an image floated to the left of that. The problem I am having is that the list item margin

Answer 1

You can give your list items an overflow property:

li {
    overflow: hidden;
}

That will cause the list item to sort of behave correctly: They will display as a square block, continuing where the image ends as well, they don´t flow nicely to the left. The next list item will.