docs.python.org - layout is messed up

[webcompat-bot]

URL: https://docs.python.org/3.6/library/urllib.request.html#module-urllib.request
Browser / Version: Firefox Mobile 39.0
Operating System: Android
Problem type: Layout is messed up

Steps to Reproduce

1. Navigate to: https://docs.python.org/3.6/library/urllib.request.html#module-urllib.request
2. Zoom in on the text/documentation without collapsing the sidebar menu.

Expected Behavior: The sidebar menu close button to not float over the text while zoomed in.

Actual Behavior: The ”«" character floats over the text. See http://m.imgur.com/5Wi1srK, 3/4 down on the page between two paragraphs. It seems like it is placed with an absolute number of pixels from the left border of the screen, which is weird when you zoom and pan on the site.

[hallvors]

I don't know why the SPAN in this code has position:fixed set - position:absolute would work just fine and handle zooming better:

<div style="border-radius: 0px 5px 5px 0px; color: rgb(68, 68, 68); background-color: rgb(170, 170, 170); font-size: 1.2em; cursor: pointer; height: 23609px; padding-top: 1px; padding-left: 1px; margin-left: 218px;" title="Collapse sidebar" id="sidebarbutton"><span style="display: block; position: fixed; top: 762px;">«</span></div>

[karlcow]

Python docs are generated by Sphinx
For this page we can see Created using Sphinx 1.2.3.

But I believe it is happening because the size of the text is overflowing on the right sidem because of certain properties such as.
https://docs.python.org/3.6/library/urllib.request.html#urllib.request.ProxyDigestAuthHandler

So another way to solve it is to add to basic.css:

dl {
    margin-bottom: 15px;
    word-wrap: break-word;
}

I opened a bug on the python project.
http://bugs.python.org/issue24772

[karlcow]

I proposed to help with a patch today given that it was not fixed yet.

[karlcow]

note to myself https://bugzilla.mozilla.org/show_bug.cgi?id=997269

[MDTsai]

Not fixed using Firefox mobile 54.

[softvision-oana-arbuzov]

This issue is still reproducible.

Tested with:
Browser / Version: Firefox Mobile Nightly 58.0a1 (2017-11-05)
Operating System: LG G5 (Android 7.0) - Resolution 1440 x 2560 pixels (~554 ppi pixel density)

[karlcow]

@softvision-oana-arbuzov can you reproduce, I tried today, but I didn't manage to reproduce. Or maybe I'm doing something wrong.

[softvision-oana-arbuzov]

@karlcow the issue seems to be fixed. The arrow remains at its designated location.

Tested with:
Browser / Version: Firefox Nightly 68.0a1 (2019-07-23)
Operating System: Samsung Galaxy S7 Edge (Android 8.0.0) - Resolution 1440 x 2560 pixels (~534 ppi pixel density)

Closing the issue as Fixed.