18

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

SomJura
  • 336
  • 1
  • 3
  • 13

5 Answers5

12

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()
Steve Bond
  • 229
  • 2
  • 5
  • 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 ) – RightmireM Aug 03 '21 at 11:59
  • @RightmireM I'm not seeing that issue. Side scroll works fine on my Mac in Chrome, at least. – Steve Bond Aug 05 '21 at 13:43
  • 1
    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! – Tony Fraser Aug 30 '21 at 17:49
  • To reenable wordwrap again: `display(HTML(""))` – Iván Sánchez Mar 13 '23 at 16:05
9

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>
Luis Meraz
  • 2,356
  • 1
  • 12
  • 8
5

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:

enter image description here

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 Jupyter Lab

As kiesel commented: In Jupyter Lab 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.

atevm
  • 801
  • 1
  • 14
  • 27
  • Fantastic answer! Thanks for your efforts! – SomJura Feb 16 '20 at 16:57
  • This still doesn't work for long numpy arrays. How could I solve that? – Jordan Kohn Apr 21 '21 at 02:59
  • @JordanKohn Strange, for me numpy arrays are displayed already wrapped even with the default CSS and config. Can you share a screenshot? – atevm Apr 21 '21 at 08:27
  • https://stackoverflow.com/a/65341534/10733210 this actually fixed my problem – Jordan Kohn Apr 21 '21 at 16:23
  • 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. – Viet Than Apr 06 '22 at 20:19
  • 1
    For JupyterLab the div seems to be called `div.jp-OutputArea` – kiesel Nov 18 '22 at 09:17
  • @kiesel thank you. It also does not read the custom.css file. I updated the answer. – atevm Nov 23 '22 at 11:22
3

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?

dakat
  • 51
  • 6
  • 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) – MD004 Jul 07 '23 at 22:51
0

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
freenrg
  • 99
  • 6