wrapping bulletted text

[lailalaila]

Hi everyone,

How do you make the text in bullets wrap so that the words on the following line dont begin under the bullet, but rather under the first word of the bulletted text? Should I do this in my html text doc (in the <li></li> tags) or in a css doc? I've never been able to figure this out. Please help. Thanks!

laila

[autocrat]

Hmm - dam good question.

I tought that they would automatically be "seperate"...

If you can, think of it as two seperate table cells... I always thought the bullet was in the left one, the text in the right...

Where as you are saying you see the bullet, you have a space, then the text... which wraps round and causes the text to continue on the line below, satarting from the bullet ?

Well - I cannot say I've ever encountered this... but try...

UL
{list-style-position: inside;}

The only thing I can think of is that you hae somehow applied different formatting else where and it is overiding.

If that doesn't help, come back and paste some of the code (or link to the page).

[MidiMagic]

It should automatically happen that way.

BUT

If you apply any overall or left margin, border, or padding style to the text in the UL list, or to a containing item, it will cause the automatic indenting to fall apart in most browsers.

Use of

list-style-position: inside;

forces the bullets to be in the paragraph, instead of separate. Use this instead:

list-style-position: outside;

[lailalaila]

thanks to you both...still working at it, but i'm not quite sure what i'm missing. :)

[MidiMagic]

You have to remove all margin, border, and padding style to get the bulleted list to display properly. This includes containing objects with styles.

Or put the following style in:

li {padding: 0;
    border: none;
    margin: 0;
    list-style-position: inside;}