Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

HTML Formatting Issue in Jupyter Notebook Causes Content to be Pushed to the Right Side of Screen #5687

Closed
mmoore7 opened this issue Aug 18, 2020 · 15 comments

Comments

@mmoore7
Copy link

mmoore7 commented Aug 18, 2020

Jupyter notebook CSS styling pushes all content to the right side, and off screen, creating a large horizontal scroll bar. Content only displays on the right side of the page, when looking at any file or page in the browser. The issue occurs Firefox (79.0-1) and Google Chrome (84.0.4147.125-1). Happens on my desktop and laptop.

Inspected the page and found a CSS left-margin parameter that is roughly equal to half the page, appearing to be the cause. Attached a screenshot. Downgrading to jupyter-notebook-6.0.3-1 fixes the issue.

Affected version:
jupyter-notebook-6.1.1-1

OS: Arch Linux
Kernel: 5.8.12-arch1-1

Steps to reproduce:
Open terminal and launch jupyter notebook with jupyter notebook

image

@kevin-bates
Copy link
Member

Can you please confirm using 6.1.3? If that still has the issue, then someone with knowledge of the front-end will need to take a look.

@mmoore7
Copy link
Author

mmoore7 commented Aug 19, 2020

The affected version is 6.1.1-1, which is the latest release on my distribution. https://www.archlinux.org/packages/community/any/jupyter-notebook/

The Arch maintainer said this was not a packaging issue.

@mohan-ys
Copy link

mohan-ys commented Aug 19, 2020

I am also having the same issue (I have version 6.1.1 as well). The work around that worked for me is to just resize & maximize the window using the resize button (i think that is what it is called). Everything lines up again.
You can recreate the issue by running the code below after you open the notebook (for some reason I am unable to load pic flies to this comment!).

# Resize jupyter
from IPython.core.display import display, HTML
display(HTML("<style>.container { width:90% !important; }</style>"))

@mmoore7
Copy link
Author

mmoore7 commented Aug 19, 2020

Resizing it was the first thing I tried, and it did not work unfortunately. Downgrading the package is the only thing that fixed it.

@rwmajor2
Copy link

I am also experiencing this. Please advise!!

@arc12
Copy link

arc12 commented Aug 19, 2020

Same problem here with a miniconda "latest" distro + "conda install jupyter=1.0.0", allowing conda dependencies to kick in.


Server Information:
You are using Jupyter notebook.

The version of the notebook server is: 6.1.1
The server is running on this version of Python:
Python 3.8.2 (default, Mar 26 2020, 15:53:00)
[GCC 7.3.0]

Current Kernel Information:
Python 3.8.2 (default, Mar 26 2020, 15:53:00)
Type 'copyright', 'credits' or 'license' for more information
IPython 7.16.1 -- An enhanced Interactive Python. Type '?' for help.

@Zsailer
Copy link
Member

Zsailer commented Aug 19, 2020

Looks like this alignment issue came from #3173. Diving a bit deeper to figure out the cause.

@cleebp
Copy link

cleebp commented Aug 24, 2020

We are also running into this issue, I have tested and see the bug on notebook=6.1.1 and notebook=6.1.3, our current workaround is to tell our users to force downgrade to notebook=6.0.3 which we know is stable.

@parmentelat
Copy link
Contributor

Hi there; same issue here, one day out of the blue suddenly all our users ran into this problem after I rebuilt our docker images

I can also add that in our case the issue seemed linked to screen width, as large window width are not affected, and maybe that's why this went unnoticed for so long ?

So just to outline that (a) this is a very disruptive one, people with their computer a little behind have smaller screens, and some of them among our users felt trapped and were unable to work, and (b) the broken release have made it into the docker-stacks images, so one can expect there may be many people about to be affected...

@kevin-bates
Copy link
Member

Hi @parmentelat - We've backed out the change that we suspected was causing this issue and have just released Notebook 6.1.4. Please try the updated release.

@parmentelat
Copy link
Contributor

THANK YOU !!

@kevin-bates
Copy link
Member

@parmentelat - since we've been unable to reproduce this issue, could you please confirm that this no longer occurs with NB 6.1.4? Your previous response implies that it doesn't occur, but it might also be in regard to building 6.1.4 in general. Thank you.

@parmentelat
Copy link
Contributor

@kevin-bates
indeed it seems that the issue does not happen in a simple setup; I have observed this on 2 different setups that were involving notebooks embedded in iframes, and it might be a factor

this means I'll need to push 6.1.4 in production - were I've had in the meanwhile to pin 6.0.3 for now - on one of these systems to answer your question, so please be a little patient

but thanks again for taking care of this

many thanks

@kevin-bates
Copy link
Member

Beautiful - thank you for the update. No worries about getting back quickly. I'm going ahead with the closure of this issue. Please feel free to post any updates you may have. Should we find this still occurs, we can re-open it at that time. Thanks for your help.

@cleebp
Copy link

cleebp commented Sep 10, 2020

We have upgraded to 6.1.4 and so far have found no lingering issues with alignment, looks good!

Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

No branches or pull requests

8 participants