2008/7/14 Tyrone Joseph <[EMAIL PROTECTED]>:
> Thanks for your reply but this doesn't solve my problem as the size list
> will be controlled by a CMS. This means that there may be times when there
> are 7 options and there may be times when are 3 options.
>
>
>
> I somehow need to center the li elements without affecting other textual
> content within the containing div. I am trying by best to keep the HTML
> clean and I don't want to add any unnecessary divs within the main div.
>
Hi Tyrone,
I've been playing around for this, and have a pretty good looking
solution for you.
<ul>
<li><a href="#">one</a></li>
<li>
two
<a href="#">sold out</a>
</li>
<li><a href="#">three</a></li>
</ul>
ul {
margin: 0;
text-align: center;
}
li {
display: inline-block;
border: 1px solid black;
padding: 5px;
margin: 5px;
vertical-align: top;
}
a {
display: block;
}
Plus you will need to send this to IE, preferably using conditional comments:
li {
zoom: 1;
display: inline;
}
Works in FF, IE 5.5, 6 and 7, Opera 9.5 and Safari 3 on PC. I haven't
looked at anything on a Mac yet.
Regards
David
http://fineartdavid.com
*******************************************************************
List Guidelines: http://webstandardsgroup.org/mail/guidelines.cfm
Unsubscribe: http://webstandardsgroup.org/join/unsubscribe.cfm
Help: [EMAIL PROTECTED]
*******************************************************************