I suck with UL and LI, advice please?

In the middle column, the list of posts are indented way to the right, does anyone know how to fix that? I suck with <UL> and <LI>

http://www.5thround.com/wordpress/

Thanks

 

I assume your using IE because it works just fine in Firefox. To fix it use this code:

CSS Code

ul {
list-style-type: none;
padding-left: none;
}

li {
padding-left: none;
}

Code (markup):

That should fix your problem, I haven't tried it so if it doesn't work let me know and I will figure it out, this is just off the top of my head

 

you're right, I am using IE but now the text is on top of the bullet. not sure why though.

 

ok, do you want the bullet? If so just remove the line

list-style-type: none;

Code (markup):

from the ul style. If you don't want the bullet the add that same line list-style-type: none; to the li style.

 

ul
{
text-align:left
]

Code (markup):

 

it's a little closer to the left, i'm also using Opera to verify the look, on Opera the bullets on heading over into the left feature story and it's still a little indented on IE

 

Different browsers use different defaults for their margins and padding on certain elements (not just values, but also the use of one property over the other). The best way to take care of this is to either use the universal selector (below) or a CSS reset (I'll post my version of that as well) to kill all the margins and padding (I think the popular CSS "resets" are too bloated for what they do, especially when all I want to do are remove the margins and padding from everything), then apply the amounts of margins and padding that you want on specific elements giving you near total control.

[b]Universal Selector[/b]

* {
	margin: 0;
	padding: 0;
}

Code (markup):

[b]My CSS Margin/Padding Reset[/b] (very handy if you have to deal with a lot of forms, since the universal selector can interfere with them)

html, body, address, blockquote, div, dl, form, h1, h2, h3, h4, h5, h6, ol, p, pre, table, ul,
dd, dt, li, tbody, td, tfoot, th, thead, tr, button, del, ins, map, object,
a, abbr, acronym, b, bdo, big, br, cite, code, dfn, em, i, img, kbd, q, samp, small, span,
strong, sub, sup, textarea, tt, var {
	margin: 0;
	padding: 0;
}

Code (markup):

 

I would rather have a universal reset at the top and not worry about zero'ing out padding/margins. Besides, "none" is not even a valid value for padding[left/right/bottom/top].

And even if you zero out padding and margins in IE, the spacing will be inconsistent because AFAIK, IE just doesn't really close LIs... a fix would be white-space:nowrap; or float for pixel perfect layouts.

*{margin:0;padding:0;font-size:100%;}
ul{list-style:none;}

Code (markup):

^ That should do

 

I wouldn't use the universal reset to set anything other than margins and padding since the properties and declarations become VERY unpredictable at that point.

Also, the universal reset can mess with form controls, which is why I suggested an alternative in my previous post.