How do I increase the cell width of the Jupyter ipython notebook in my browser

Question

I would like to increase the width of the ipython notebook in my browser  I have a high-resolution screen  and I would like to expand the cell width size to make use of this extra space   Thanks     edit  5 2017  I now use jupyterthemes  https   github com dunovank jupyter-themes  and this command   jt -t oceans16 -f roboto -fs 12 -cellw 100    which sets the width to 100  with a nice theme

User · Answer

I tried everything and nothing worked for me  I ended up using displaying my data frame as HTML as follows  from IPython display import HTML     HTML  pd to html

User · Answer

If you don t want to change your default settings  and you only want to change the width of the current notebook you re working on  you can enter the following into a cell   from IPython core display import display  HTML display HTML   lt style gt  container   width 100   important    lt  style gt

User · Answer

You can set the CSS of a notebook by calling a stylesheet from any cell  As an example  take a look at the 12 Steps to Navier Stokes course   In particular  creating a file containing   lt style gt      div cell          width 100           margin-left 1           margin-right auto         lt  style gt    should give you a starting point  However  it may be necessary to also adjust e g div text cell render to deal with markdown as well as code cells   If that file is custom css then add a cell containing   from IPython core display import HTML def css styling        styles   open  custom css    r   read       return HTML styles  css styling     This will apply all the stylings  and  in particular  change the cell width

User · Answer

What I do usually after new installation is to modify the main css file where all visual styles are stored  I use Miniconda but location is similar with others C  Miniconda3 Lib site-packages notebook static style style min css  With some screens these resolutions are different and more than 1  To be on the safe side I change all to 98  so if I disconnect from my external screens on my laptop I still have 98  screen width   Then just replace 1140px with 98  of the screen width     media  min-width  1200px       container       width  1140px            After editing   media  min-width  1200px       container       width  98            Save and restart your notebook     Update  Recently had to wider Jupyter cells on an environment it is installed  which led me to come back here and remind myself    If you need to do it in virtual env you installed jupyter on  You can find the css file in this subdir  env lib python3 6 site-packages notebook static style stye min css

User · Answer

I made some modification to  jvd10 s solution  The   important  seems too strong that the container doesn t adapt well when TOC sidebar is displayed  I removed it and added  min-width  to limit the minimal width   Here is my  juyputer custom custom css      Make the notebook cells take almost all available width and limit minimal width to 1110px     container       width  99       min-width  1110px           Prevent the edit cell highlight box from getting clipped     important so that it also works when cell is in edit mode   div cell selected       border-left-width  1px

User · Answer

To get this to work with jupyter  version 4 0 6  I created    jupyter custom custom css containing      Make the notebook cells take almost all available width     container       width  99   important           Prevent the edit cell highlight box from getting clipped     important so that it also works when cell is in edit mode   div cell selected       border-left-width  1px  important

User · Answer

For Firefox Chrome users  a nice way to achieve 100  width is to use a custom TamperMonkey script   The benefits are   configure this once in your browser  no need to modify the server configuration  works with multiple jupyter servers  TamperMonkey is trusted  maintained  and stable  Lots of additional customization is possible via javascript    This script works for me https   gist githubusercontent com mrk-andreev 2a9c2538fad0b687c27e192d5948834f raw 6aa1148573dc20a22fca126e56e3b03f4abf281b jpn tmonkey js

User · Answer

As of 2018  I would advise trying out JupyterHub JupyterLab  It uses the full width of the monitor  If this is not an option  maybe since you are using one of the cloud-based Jupyter-as-a-service providers  keep reading    Stylish is accused of stealing user data  I have moved on to using Stylus plugin instead   I recommend using Stylish Browser Plugin  This way you can override css for all notebooks  without adding any code to notebooks   We don t like to change configuration in  ipython profile default  since  we are running a shared Jupyter server for the whole team and width is a user preference   I made a  style specifically for vertically-oriented high-res screens  that makes cells wider and adds a bit of empty-space in the bottom  so you can position the last cell in the centre of the screen  https   userstyles org styles 131230 jupyter-wide You can  of course  modify my css to your liking  if you have a different layout  or you don t want extra empty-space in the end   Last but not least  Stylish is a great tool to have in your toolset  since you can easily customise other sites tools to your liking  e g  Jira  Podio  Slack  etc     media  min-width  1140px       container       width  1130px          end space     height  800px

User · Answer

This is the code I ended up using  It stretches input  amp  output cells to the left and right  Note that the input output number indication will be gone   from IPython core display import display  HTML display HTML   lt style gt  container   width 100   important    lt  style gt     display HTML   lt style gt  output result   max-width 100   important    lt  style gt     display HTML   lt style gt  prompt   display none  important    lt  style gt

User · Answer

For Chrome users  I recommend Stylebot  which will let you override any CSS on any page  also let you search and install other share custom CSS  However  for our purpose we don t need any advance theme  Open Stylebot  change to Edit CSS  Jupyter captures some keystrokes  so you will not be able to type the code below in  Just copy and paste  or just your editor    notebook-container container       width  90       Change the width as you like  I find 90  looks nicer than 100   But it is totally up to your eye

User · Answer

It s time to use jupyterlab  Finally  a much-needed upgrade has come to notebooks  By default  it uses the full width of your window like any other full-fledged native IDE    All you have to do is   pip install jupyterlab   if you use conda conda install -c conda-forge jupyterlab   to run  jupyter lab      instead of jupyter notebook   Here is a screenshot from blog Jupyter org

User · Answer

That div cell solution didn t actually work on my IPython  however luckily someone suggested a working solution for new IPythons   Create a file    ipython profile default static custom custom css  iPython  or    jupyter custom custom css  Jupyter  with content   container   width 100   important      Then restart iPython Jupyter notebooks  Note that this will affect all notebooks

[python] How do I increase the cell width of the Jupyter/ipython notebook in my browser?

Examples related to python

Examples related to ipython

Examples related to ipython-notebook

Examples related to jupyter-notebook

Examples related to jupyter