horizontal unordered list
I can do this in 5 seconds with a ta开发者_如何转开发ble but I'm trying to avoid it by using CSS, looks fine in FF but problem is it doesn't work in IE (the second li appears underneath the first li)
<ul style="list-style-type:none; margin:0px; padding:0px">
<li style="width:120px; display:table-cell; padding: 1px;"><?=$m['make']?></li>
<li style="width:30px; display:table-cell; padding: 1px;"><input id="changemanufacturer" type="checkbox"></li>
</ul>
Don't use table cell. Do:
<li style="width:120px; display:inline; float:left;">Boo!</li>
Of course you should have your CSS external but I'll assume it's just to simplify the question.
If you're using IE7 or IE8, make sure your DOCTYPE is present so that its not rendering in quirks mode.
Using the HTML4 Strict or HTML5 DOCTYPES worked for me in IE8
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<body>
<ul style="list-style-type:none; margin:0px; padding:0px">
<li style="width:120px; display:table-cell; padding:1px;">asdf</li>
<li style="width:30px; display:table-cell; padding: 1px;">
<input id="changemanufacturer" type="checkbox">
</li>
</ul>
</body>
</html>
HTML5: <!DOCTYPE html>
精彩评论