I'm using the Minima template, and generating DIVs with the help of the div_shorthand plugin. Here's what I have now:
<div class="il"><p><img src="pic.jpg" width="240"><img src="pic.jpg" width="240"></p></div>
.il p { display:table; margin:0 auto; }
.il img { float:left; }
But the DIV simply refuses to center. For a live demonstration, please see
http://www.claes.idv.tw/playground/playground
The four images there should, as one whole block, be centered on the page, yet it isn't.
In an attempt to find my error, I made up a test html page with the following body:
<body>
<style type="text/css">
.il p { display:table; margin: 0 auto;}
.il img { float:left; margin: 3px;}
</style>
<div class="il"><p><img src="pic.jpg" width="240"><img src="pic.jpg" width="240"></p></div>
</body>
And these two images on the text page centers without a problem.
I'm at a loss why the same code won't work when it's on a DokuWiki page, and I can't see anything obvious that could prevent it from centering. Any tips are appreciated.