Body text wrapping around tables

Help / Discuss
1

Apologies for the simple question, but I can’t find any discussion in other threads or in the documentation.

Is it possible to wrap body text around a table?

I’m trying to put an small table of information on the top right of a page, akin to an Infobox in Wikipedia. Currently using a simple table I end up with the body content appearing after / underneath the table which is quite disorientating for a reader.

I’ve tried using both the visual and the source editor, but haven’t managed to make any progress.

Thanks.

2

Hi,

You might want to use the box macro for this, here is an example of a floating box to render a table of content: https://extensions.xwiki.org/xwiki/bin/view/Extension/TOC%20Macro#HExample2:Floating
The example works by setting floatinginfobox to the CSS class parameter of the macro.

In your case, you might also want to set a fixed width, which you can do with the width parameter.

Hope this helps!

3

Thanks for the prompt suggestion; this works pretty well!

The code I ended up with is below for reference (I’ve simplified the table itself for clarity). This includes an image before the table, which automatically shrinks to fit the width of the specified box.

{{box width="320px" cssClass="floatinginfobox" image="filename.png"}}
(% style="margin-left:auto; font-size:86%" %)
|=(% colspan="2" style="background-color: rgb(178, 207, 245);" %)Heading 1
|=Subtitle 1 |Content 1
|=Subtitle 2 |Content 2
|=(% colspan="2" style="background-color: rgb(178, 207, 245);" %)Heading 2
|=Subtitle 3 |Content 4
|=Subtitle 5 |Content 5
{{/box}}

A minor point - it doesn’t play nice if there are full-width tables in the body text. For anyone reading this in future: you need to specify the width of any tables in the body text to be less than the available width left by the box macro, otherwise they’ll only appear after the box macro leaving vertical white space.