In article <5o************@mid.individual.net>,
Harlan Messinger <hm*******************@comcast.netwrote:
Please take a look at
http://www.gavelcade.com/list_next_to_float.html
How can I style a list so that if it appears next to a left-floated box
as the first list does in this example, the list items, with their
bullets, still appear indented relative to the text above and below the
list (i.e., without having the bullets overlapping the float), without
messing up the appearance if the list *doesn't* happen to land next to
the float, as in the case of the second list?
Consider either list-style: none and/or zero margins and paddings
for the UL remotely near the float. Odd things happen otherwise
on some browsers.
If you want bullets, consider 'made' bullets within the li,
either via img or char:
<li>€ List item 1</li>
<li>€ List item 2</li>
Using Option 8 for the dot on a Mac produces very nice results,
that look pretty consistent with your list further down which has
real html bullets. There is perhaps something more dependable? Or
an img dot, you can make it scaleable by em dimensioning it.
I would also be inclined to class the ul that is anywhere near
such a float and:
ul.class {list-style: none;}
There is the interesting "problem" of an oddity in appearance
when some list items drop below the float but not all, (add more
li items to see). I find it acceptable but you may want this not
to happen?
--
dorayme