Search code examples
htmlcsspython-sphinxrestructuredtextread-the-docs

How can I avoid the horizontal scrollbar in a ReST table?


I have this table in ReST markup:

+---------------------------+-----------------------------------------------------------------+
| Option Line Kind          | Distinguishing Characteristic                                   |
+===========================+=================================================================+
| **Reference**             | The option name is called a (node) reference, if the value\     |
|                           | of an option is a predefined keyword for the current node\      |
|                           | class. Because the option's value is a keyword, it can not\     |
|                           | be an interpolated value.                                       |
+---------------------------+-----------------------------------------------------------------+
| **Option**                | The option uses a defined option name valid for the current\    |
|                           | node class. The value can be a fixed or interpolated string.    |
+---------------------------+-----------------------------------------------------------------+
| **User Defined Variable** | Otherwise an option line is a user defined variable. It can\    |
|                           | have fixed or interpolated string values.                       |
+---------------------------+-----------------------------------------------------------------+

Sphinx (ReadTheDocs theme) generates a horizontal scrollbar instead of breaking the content in column 2. The result is this mess:

enter image description here

What do I need to change in ReST (or the RTFD theme??) to let it break the text?


Edit:

The answer from @aflp91 results in this table: enter image description here


Solution

  • Add a _static/custom.css file with

    .wy-table-responsive table td {
    white-space: normal;
    }
    

    Don't forget to declare it into conf.py:

        def setup(app):
            app.add_stylesheet('custom.css')
    

    Works in my test…