display:table killing me in IE
- by subpixel
I want to create horizontally-aligned table cells like the ones on this page.
I've followed the instructions, and I've even copied the css and markup verbatim, but no matter what I do IE 8 renders my table cells as blocks (stacked on top of each other instead of aligned next to each other).
css:
<style type="text/css">
body.TableStyles {
display: inline-table;
border-spacing: 4px;
}
div.maketable p {
display: table-cell;
width: 20%;
background-color: #cdf;
padding: 4px;
}
</style>
markup:
<body class="TableStyles">
<div class="maketable">
<p>< prev</p>
<p>next ></p>
</div>
</body>
