Re: framed wide tables

[Axial]

Here is a recipe you can try :

• Use the .. class:: directive just prior to your table (here I'll call it 'scrollwide' - you can use any name you like as long as it conforms to CSS/Sphinx rules):

.. class:: scrollwide

================== =================================================================

col 1              col 2

================== =================================================================

entry 1            vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 2

entry 3            vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 4

entry 5            vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 6

================== =================================================================

• Add an additional stylesheet to your conf.py (here 'scrollwide.css'):

def setup(app):

    app.add_stylesheet('scrollwide.css')

• Create the according CSS file in your _static directory with the following content:

table.scrollwide {

    display: block;

    width: 400px;

    background-color: #E0;

    overflow: auto;

}

table.scrollwide td {

    white-space: nowrap;

}

You should get a result similar to this:

See also

• http://docutils.sourceforge.net/docs/ref/rst/directives.html#class (class directive)
  
• http://sphinx-doc.org/config.html#confval-html_static_path (static path config)
  

One thing which might trip you up is that the class directive might be overwritten by domain extensions.

Use .. rst-class:: instead (see http://sphinx-doc.org/rest.html#id3)

Check your HTML source after the Sphinx build. It should contain the additional CSS class. My example looks like this:

<table border="1" class="scrollwide docutils">

<colgroup>

<col width="22%" />

<col width="78%" />

</colgroup>

<thead valign="bottom">

<tr class="row-odd"><th class="head">col 1</th>

<th class="head">col 2</th>

</tr>

</thead>

<tbody valign="top">

<tr class="row-even"><td>entry 1</td>

<td>vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 2</td>

</tr>

<tr class="row-odd"><td>entry 3</td>

<td>vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 4</td>

</tr>

<tr class="row-even"><td>entry 5</td>

<td>vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 6</td>

</tr>

</tbody>

</table>

Now you should be able to style your table any way you want. I hope this helps.

On Wednesday, 31 October 2012 05:05:11 UTC+13, Davide Cittaro wrote:

Hi all, I'm pretty new to Sphinx, it looks great for my documentation purposes :-)

I'm trying to insert a wide table, meaning that it exceeds the screen width and, most important, it is written over the sidebar. I wonder if it is possible to put a table in a frame just like code-blocks are (indeed code blocks are rendered in a scrollable frame).

Thanks

d

[Davide Cittaro]

Using rst-class worked! Thanks!!

d

On Nov 6, 2012, at 3:05 AM, Axial <holger...@gmail.com> wrote:

> Here is a recipe you can try :
> • Use the .. class:: directive just prior to your table (here I'll call it 'scrollwide' - you can use any name you like as long as it conforms to CSS/Sphinx rules):
> .. class:: scrollwide
> ================== =================================================================
> col 1 col 2
> ================== =================================================================
> entry 1 vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 2
> entry 3 vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 4
> entry 5 vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvery long entry 6
> ================== =================================================================
> • Add an additional stylesheet to your conf.py (here 'scrollwide.css'):
> def setup(app):
> app.add_stylesheet('scrollwide.css')
> • Create the according CSS file in your _static directory with the following content:
> table.scrollwide {
> display: block;
> width: 400px;
> background-color: #E0;
> overflow: auto;
> }
> table.scrollwide td {
> white-space: nowrap;
> }
>
> You should get a result similar to this:
>
>

> --
> You received this message because you are subscribed to the Google Groups "sphinx-users" group.
> To post to this group, send email to sphinx...@googlegroups.com.
> To unsubscribe from this group, send email to sphinx-users...@googlegroups.com.
> Visit this group at http://groups.google.com/group/sphinx-users?hl=en.
>
>

---
Davide Cittaro
daweo...@gmail.com
http://sites.google.com/site/davidecittaro/

[Monami Bhattacharya]

This was very useful, thanks!