Align list to the left

csa · August 15th, 2006, 04:57 AM

Is there an easy way to align a bulleted list to that it is right up the left hand side and is viewable in all browsers? See Attached. In this instance I am using my own image bullets rather than pre-set. Thanks

Ryan Fait · August 15th, 2006, 05:01 AM

I don't quite understand what you're trying to do, but something like this will give you full control:

Code:

<style type="text/css">
    ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    li {
        margin: 0;
        padding: 0 0 0 10px;
        background: #fff url("bullet.gif") no-repeat 0 50%;
    }
</style>

masonbarge · August 15th, 2006, 07:39 AM

You really need to restate your question more carefully. I can't tell what you want to do.

moojoo · August 15th, 2006, 10:43 AM

Something like this should get you going.

#foo ul {
padding:0;
margin:0;
}

#foo li {
list-style-type:none;
padding: 0 0 0 12px; /* or whatever the bullet size is plus a few pixels */
background: url(../images/foo_bullet.jpg) center left no-repeat;
}

csa · August 16th, 2006, 04:22 AM

Thank you css posters, this has worked.

Will try and expand on my posts in future.