Ul or ol with no indent

HTML & CSS
1

Hi,

How do I make <ul> or <ol> with no indent? That is, I don’t want the whole list indented at all. I still want text to align left with the bullet.

[left]Thanks,
[/left]

Ben

2

try this:


ul, ol {
 margin-left:0px;
}
3

I found my answer in another thread: set padding-left to 0px and experiment with margin-left.

Thanks.

http://www.sitepoint.com/forums/showthread.php?t=130495

4

Also look into


list-style-position: inside /* our outside */
5

If each list item runs more than one line, it tends to bleed into the area set for numbering if you use an inside list style. However, if this is the effect you want then go for it. In most browsers, this has worked for me:


ul, ol {
  padding: 0;
  margin-left: 1em;
}

This will make your list numbering flush with any other text elements (paragraphs, etc.) nearby in nearly every browser I’ve tried it on.