html - ul padding not applying next to a floating img -


i have basic css problem.

i have floating image in top-left corner margin-right. content made of paragraphs , lists bullets. want lists have padding-left more visibility , bullets appear in "list-style-position: outside" (text must aligned).

my problem is, when list displayed next floating image, ul padding not applying.

here annotated screenshot comprehension :

enter image description here

this kind of behavior happens ff , chrome. ie, worse because bullets appear @ left of floating image...

edit : css property "ul{overflow: hidden;}" not option because want avoid :

enter image description here

i'm sorry can't show piece of code because drupal website , content of node generated wysiwyg module , written webmaster , editors. have no access generated structure. content not fixed , lists appear everywhere in text.

this fiddle represents situation: http://jsfiddle.net/34cuf/

lists have initial left padding on them (so there enough space show bullet) unless give ul padding greater initial value, list move left instead of right.

have @ example

to make ul behave next floated element need float too: example


Comments

Popular posts from this blog

windows - Single EXE to Install Python Standalone Executable for Easy Distribution -

c# - Access objects in UserControl from MainWindow in WPF -

javascript - How to name a jQuery function to make a browser's back button work? -