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] *******************************************************************