quiffhanger

For the benefit of everyone:Didn't manage to solve it properly. In the end I just gave all LI tags an extra 3em margin. The downside is that when not next to a floating div, the list items appear an extra 3em's indented than they would normally.Also caused a problem if you use lists when real estate is at a premium: for this I created an extra class li.nomargin (margin-left: 0px;} to scrap the extra margin.All a bit ugly, but there you go...-rossP.S. I used Gobby with boen_robot to explore the problem a little bit - it's a very cool app.

Been fiddling with this. If I put the main text in a div, margin's and padding are always applied relative to the edge of the screen, not relative to the div so they are ignored unless they are bigger than the div itself.I'm wondering if my problems are due to my lack of understanding the css "position" property. I've tried playing with it a bit but to no avail.I've been updating http://flat5.org/test.html with my attempts, feel free to take a look.

But the problem is it's inconsistent: no matter how big a margin I set on the div, the bullet points will still be further left than the paragraph text. However, when the list isn't next to a div, the bullet points are indented _more_ than the paragraph text. I suppose I could give the li tags a margin, but then when they're not next to a div they will have a really big margin and look daft. As I mentioned, due to text wrapping on different screen sizes I dont know if my list is going to be next to a div or not...

Can anyone explain this behaviour to me? I would've called it a bug but it seems to occur in all browsers I've tried.Here's a small demonstration (description below): http://flat5.org/test.htmlWhen placing paragraph text and a list to the right of a floating div (i.e. a common way to have a menu) the list text has the same margins as the paragraph text. Sounds fine? No! This results in the bullet points themselves, usually a couple of em's further left floating somewhere inside you div! In some browsers, particular if you div has in image in it, this results in invisible bullet points, in others it just "looks weird".So, presuming this is designed behaviour, what's the proper way to sort it out! It's actually quite hard for me to nudge stuff around as appropriate as I've got a lot of lists, only some of them next to a floating div, depending on screen size! I'm also working within a cms so fiddling with the html can be a bit tricky.