Modifying content width of the Sphinx theme 'Read the Docs'

In case someone is searching for a simpler answer... combining the ideas from https://samnicholls.net/2016/06/15/how-to-sphinx-readthedocs/ and the above suggestions, I found the easiest way of getting a custom window-width is the following:

  1. In conf.py, add a function that adds a custom stylesheet:

    def setup(app):
        app.add_css_file('my_theme.css')
    
  2. In conf.py, state/adjust:

    html_static_path = ['_static'] 
    
  3. Create a _static folder/directory if it doesn't exist.

  4. Create a file called my_theme.css in the _static folder that contains the lines:

    .wy-nav-content {
        max-width: 1200px !important;
    }
    

Another option is to create a stylesheet in source/_static with just the css you want, e.g.

.wy-nav-content {
    max-width: none;
}

or

.wy-nav-content {
    max-width: 1200px !important;
}

Make sure the directory is referenced in source/conf.py - I believe by default there's a line to do this, i.e.

# Add any paths that contain custom static files (such as style sheets) here,
# relative to this directory. They are copied after the builtin static files,
# so a file named "default.css" will overwrite the builtin "default.css".
html_static_path = ['_static']

Then create a custom layout in source/_templates/layout.html and do something like this to include your stylesheet

{% extends "!layout.html" %}
{% block extrahead %}
    <link href="{{ pathto("_static/style.css", True) }}" rel="stylesheet" type="text/css">
{% endblock %}

Assuming you called your stylesheet style.css


The HTML option added in Sphinx 1.8.0b1 (released Sep 2018) simplifies the process. The recommendation in Read The Docs Documentation is adding custom css to the theme via the html_css_files option in conf.py.

html_css_files = [
    'custom.css',
]

Put the custom.css in the html static path folder (Default is _static folder).

Content of custom.css:

.wy-nav-content {
    max-width: 75% !important;
}