How to disable line wrapping in Jupyter notebook output cells?

Question

By default longer lines of text in the output cells of a Jupyter notebook will be wrapped. How to stop this behaviour?

Answer 1

There seems to be an extension specifically for this use-case, and targeting Jupyter Lab:

https://github.com/aldder/jupyterlab_linewrapcellouput

It doesn't work for me and I haven't yet figured it out, but it might for you.

Answer 2

I was able to solve this problem by adding a simple CSS rule to the custom/custom.css file in my Jupyter user configuration:

/*Disable code output line wrapping*/
div.output_area pre {
    white-space: pre;
}

The result:

The div.output_area pre selects the pre preformated text areas of the code output areas for the rule (set of css properties). The white-space property states how the browser should display white spaces in the selected HTML elements with the pre value the browser only breaks at new line characters \n and <br> elements.

This CSS renders well (with a fine horizontal scrollbar) for my Firefox v70.0 and Chorme v78.0.3904.97, according to Can I Use the white-space: pre property and value should work on all modern desktop browsers.

You can find out where your configuration resides by running the following shell command:

jupyter --config

If you want make further style modifications just play around with the inspector of your favorite browser on Jupyter Notebook tab. where you can modify the CSS without permanent effects.

Update for JupyterLab

As kiesel commented: In JupyterLab the class of the parent div is changed to jp-OutputArea-output. However there is another problem: Jupyter Lab does not read the custom/custom.css file. There is two way around this.

1. (dirty, fast) edit the theme in use.

In my case I edited the ~/miniconda3/envs/< env name >/share/jupyter/lab/themes/@jupyterlab/theme-dark-extension/index.css file and added the following code.

div.jp-OutputArea-output pre {
    white-space: pre
}

of course this fix will only work in the one specific environment where you edited the theme index.css. Therefore I do not recommend it.

2. (clean, slow) Use an extension which supports custom CSS

This nice fellow made a theme for Jupyter Lab which allows you to include a custom CSS file.

Answer 3

The answers to this post did not work for me because I'm using Jupyter Lab (as noted by @kiesel). This slight change did the trick:

%%html
<style>
div.jp-OutputArea-output pre {
    white-space: pre;
}
</style>

Answer 4

Printing DataFrames in Jupyter Notebooks may not display all columns if there are many columns:

print(my_dataframe.head(2))

                        open     high  ...             low_time            high_time
time                                   ...                                          
2015-02-06 00:00:00  0.77970  0.78590  ...  2015-02-06 00:30:00  2015-02-06 02:30:00
2015-02-06 04:00:00  0.78276  0.78433  ...  2015-02-06 04:30:00  2015-02-06 07:30:00

We can force Jupyter Notebooks to display all columns by setting max_columns option to None as shown below. However, this will wrap the rows adding a "\" if there are too many columns:

pd.options.display.max_columns = None
print(my_dataframe.head(2))

                        open     high      low    close  tick_volume  spread  \
time                                                                           
2015-11-25 08:00:00  0.72714  0.72829  0.72525  0.72534        45192       1   
2015-11-25 12:00:00  0.72534  0.72615  0.72379  0.72429        48685       1   

                     real_volume             low_time            high_time  
time                                                                        
2015-11-25 08:00:00  87365088000  2015-11-25 11:30:00  2015-11-25 09:00:00  
2015-11-25 12:00:00  83349117000  2015-11-25 15:30:00  2015-11-25 12:30:00  

This wrapping can be fixed by setting expand_frame_repr to false:

pd.options.display.max_columns = None
pd.options.display.expand_frame_repr = False
print(my_dataframe.head(2))

                        open     high      low    close  tick_volume  spread  real_volume             low_time            high_time
time                                                                                                                               
2015-02-06 00:00:00  0.77970  0.78590  0.77933  0.78280        18061       4  21357500000  2015-02-06 00:30:00  2015-02-06 02:30:00
2015-02-06 04:00:00  0.78276  0.78433  0.78117  0.78401        12310       4  14275000000  2015-02-06 04:30:00  2015-02-06 07:30:00

In some cases the following may also help or be necessary:

pd.options.display.width=None

Answer 5

I can't comment so I have to answer: maybe there's something different with the last versions of Jupyter. If the accepted answer doesn't work, you can try with "jp-OutputArea-output" instead of "div.output_area"; for example

from IPython.core.display import display, HTML
display(HTML("<style>div.jp-OutputArea-output pre {white-space: pre;}</style>"))

And if you have a dark-mode browser and you don't like the resulting lighter scrollbars, you can try to set the dark mode in Jupyter adding

display(HTML("<style>:root {color-scheme: dark;}</style>"))

See: How do I switch to Chromes dark scrollbar like GitHub does?

Answer 6

You can use an html magic command. Check the CSS selector is correct, by inspecting the output cell, then edit the below accordingly.

%%html
<style>
div.output_area pre {
    white-space: pre;
}
</style>

Answer 7

If you don't want to mess around with a config file, you can modify the behaviour of a notebook ad hoc by calling the IPython.core.display function. Then add the CSS suggested by @atevm:

from IPython.core.display import display, HTML
display(HTML("<style>div.output_area pre {white-space: pre;}</style>"))

for line in range(5):
    for num in range(70):
        print(f" {num}", end="")
    print()