Bullets in UL List hidden by left floated navbar

Giganews Newsgroups
Subject: Bullets in UL List hidden by left floated navbar
Posted by:  Wiz (wizcraf…@hotmail.com)
Date: Tue, 15 Jun 2004

Greetings the group!
I see from a few previous postings that I am not the only person having a
problem with hidden list item bullets. This question applies to both IE 6,
current version, and Firefox 0.8 browsers, which I am using for testing.

I have a design in progress that uses a relatively positioned, left-floated,
122px wide navbar, with the main content padded to the right by 10px,
wrapping under after it exceeds the height of the navbar. Everything looks
fine, except when it comes to ordered and unordered list items. The bullet
dots, or decimal numbers are hidden inside the navbar, by approximately
15px. I have managed to push them back into the content area by applying
this inline style to the UL and OL tags:  <ul style="margin-left:70px;
padding-left:70px">. This pushes the bullets into the main content area by
about 12 px from the edge of the navbar. Is this the correct fix, or is
there a better method?

I even tried wrapping the lists inside a blockquote, to no avail. There was
no right offset added. I can get the lists to display normally if I add a
<div style="clear:left"> or <br clear="left">, before the list starts, but
this defeats the design by dropping the lists entirely under the navbar.

I notice that with this fix the list items that should wrap under the navbar
do not, but are offset about 132px to the right, all the way to their end,
whereas paragraphs and headings float to the left edge. If I remove the
margin and padding the list items that have passed the navbar do go close to
the left edge of the body. This tells me that list items are being
positioned relative to the left edge of the html and body, rather that the
containing DIV. Is this correct? Is there a workaround to make lists behave
like other floated block items?

Thanks in advance


Posted IMHO, by "Wiz"
Please reply to the group