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?

Thomsen

do you want a horizontal scroll bar or the output cell width's to adapt to its content? – Chanterelle

both options would be acceptable. a horizontal scroll bar would be better. – Thomsen

For VS Code users, see How can I prevent output lines from wrapping in VS Code Jupyter Notebooks? – Tristich

Answer 1

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.

Ligniform

Fantastic answer! Thanks for your efforts! – Thomsen

This still doesn't work for long numpy arrays. How could I solve that? – Custommade

@JordanKohn Strange, for me numpy arrays are displayed already wrapped even with the default CSS and config. Can you share a screenshot? – Ligniform

https://mcmap.net/q/376173/-how-to-print-the-full-numpy-array-without-wrapping-in-jupyter-notebook this actually fixed my problem – Custommade

This was so painful but I was having problems that something override this. apparently it's because of log = logging.getLogger("rich"), can't be sure though, just a note for future dev. In the end I output what I have and opened a new notebook to read whatever I needed. – Monas

For JupyterLab the div seems to be called div.jp-OutputArea – Cytology

@Cytology thank you. It also does not read the custom.css file. I updated the answer. – Ligniform

Answer 2

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()

Reid

This worked to stop the line wrap, but the cell displaying the data doesn't extend (can't scroll it side to see to actually SEE the unwrapped data :D ) – Qr

@Qr I'm not seeing that issue. Side scroll works fine on my Mac in Chrome, at least. – Reid

Wish I could up arrow this response twice! Add that import and display line at the top of your jupyter notebook, and from there out you sparkdf.show(5,False) and it won't wrap! – Tamtama

To reenable wordwrap again: display(HTML("<style>div.output_area pre {white-space: pre-wrap;}</style>")) – Hanky

Answer 3

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>

Deauville

Answer 4

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?

Briefs

Yes, this worked for me in JupyterLab Desktop 3.6.3 (though I used the magic html command, as other answers suggest, rather than HTML object) – Arnold

Answer 5

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

Imf

Answer 6

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>

Intoxicant

tagging with "JupyterLab" (source: jupyter.org) so search on page finds this. – Goidelic

Answer 7

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.

Fecteau