Floating Elements and List Items

The case of the disappearing margins

[Andunaphel]

I've never posted on a board for coding help before, so please bear with me. I am at wits end here over something to which I'm probably just not seeing the easy solution.

I'm working on a style sheet for a site where graphics and tables are placed on the left side of the screen, and the surrounding text is floated around it. Occasionally, this floated text is an unordered list, complete with the bullets. I've set it up so that the list items are supposed to be indented 12pt from the right side of the element to its left. Or at least I thought it did. It works fine when there's nothing to the left, just the side of the screen. But when the unordered list is next to one of the floating elements, the margin disappears. In fact, the bullet actually ends up inside of the floating element.

Is there any way to keep this from happening? (The relevant portions of my style sheet follow)

ul {
text-align:left;
font: 12pt Minion;
color: black;
display: list-item;
margin-left: 12pt;
}

li {display: list-item;}

.holder {
height: 200px;
width: 400px;
border: 1px solid black;
float: left; }
(Note: the height and the width declaration in here won't be in there in the end. I just used them so I could have a space to see on the screen. I've had images and tables in there before, and the bullets just appear tight on top of them.)

[Andunaphel]

Oh, I forgot to add that this problem presents when any block-level element that has a set margin is floated next to the image/table holder, not just list items. I have block quotes that have margins of 12pt on both sides that disappear on the left when next to the floating element.