How to make text wrap around a table, as if it were an image

css, html, tabular

Solution

Just float the table to the right (which is how you should be positioning the image as well):

<table style="float: right">
    <!-- ... -->
</table>
<p>Bunch of text...</p>

Demo: http://jsfiddle.net/ambiguous/ZLfg7/1/

Problem

I'm surprised I couldn't find a solution to this. I would like to position a small table (1 row, 3 cells,) near the top of my document, aligned to the right, with a paragraph wrapping around it, just as you can do with an image with the following code... ``` <img src="http://www.sorenwagner.ws/marty/img/ca-seal.jpg" align="right" width="300" height="100"> This is a paragraph large enough to wrap around the image... This is a paragraph large enough to wrap around the image... This is a paragraph large enough to wrap around the image... This is a paragraph large enough to wrap around the image... ``` It would be nice as well to be able to define padding around the table, so the text is not right up to the border. Is there a relatively simple solution for this in CSS?

Original source