Menu
Can anyone tell me why an unordered list has a default indent/padding applied to it? Can this be solved with a CSS Browser Reset?
464
By default, unordered lists are displayed by browsers with a bullet in front of each list item . Although lists typically show up with either numbers or bullets, they don't always.
Like an ordered list element, an unordered list element (<ul>) will indent its list items — or bullet points — by default. If you'd like to change the indentation distance, then you can use the margin-left or padding-left property.
To create unordered list in HTML, use the <ul> tag. The unordered list starts with the <ul> tag. The list item starts with the <li> tag and will be marked as disc, square, circle, etc. The default is bullets, which is small black circles.
As to why, no idea.
A reset will most certainly fix this:
ul { margin: 0; padding: 0; } I found the following removed the indent and the margin from both the left AND right sides, but allowed the bullets to remain left-justified below the text above it. Add this to your css file:
ul.noindent { margin-left: 5px; margin-right: 0px; padding-left: 10px; padding-right: 0px; } To use it in your html file add class="noindent" to the UL tag. I've tested w/FF 14 and IE 9.
I have no idea why browsers default to the indents, but I haven't really had a reason for changing them that often.
35
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
