CSS floating images and lists

I had a piece of text with an image floated within it that looked exactly as required.

Upon adding unordered list HTML in-between two of the paragraphs, the text above and below the list still looked fine but the bullet points of the unordered list were on the edge of the actual image.

It seems that floating images don't work with <ol> and <ul> commands the same as they do with <p> commands but the fix was to give the unordered list a style of a left margin which matched the width of the image (plus any margin the image itself may have).

<ul style="margin-left:210px;">