Page MenuHomePhabricator

navigational sidebar on mobile, should float on wide screens.
Closed, ResolvedPublic

Description

When viewing a Wikipedia article with Examples sidebar (such as this one ) on a mobile device, the sidebar is shown in the centre of the page, and above other content, whereas with the the desktop view, it is in the right (this is the expected behaviour).

Related Objects

StatusSubtypeAssignedTask
ResolvedIzno
ResolvedTgr
ResolvedAnomie
Resolvedtstarling
Resolvedcoren
ResolvedAnomie
DeclinedBUG REPORTNone
ResolvedAnomie
ResolvedEsanders
ResolvedEsanders
Resolved ssastry
ResolvedAnomie
ResolvedCKoerner_WMF
Resolvedjhsoby
ResolvedTgr
DeclinedTgr
Resolvedcoren
ResolvedAnomie
ResolvedTgr
DeclinedNone
Resolved ssastry
ResolvedTgr
ResolvedTgr
ResolvedTgr
Resolved Deskana
ResolvedCKoerner_WMF
Resolved Whatamidoing-WMF
ResolvedTgr
ResolvedTgr
ResolvedTgr
ResolvedUrbanecm
ResolvedTgr
ResolvedTacsipacsi
ResolvedTgr
ResolvedCKoerner_WMF

Event Timeline

mobile web or one of the apps? if apps, which platform?

This appears on the mobile website, I was viewing it through Safari on my iPad, and it is the same on the iPad Chrome browser.

This is an issue with the local template and not an issue with MobileFrontend.

Actually, that template uses
https://en.m.wikipedia.org/wiki/Template:MetaSidebar
which contains style="float:right;...". However, in the mobile version, some CSS overwrites this with float: none !important;.

The same happens with the Template:MetaSidebar on mobile devices

You can't just float stuff on a small screen. Seems like intended behaviour to me, I agree with @Jdlrobson.

@Sjoerddebruin, not all mobile screens are small. For example, my iPad has a fairly large screen, and it looks weird when the examples are at the top of the page, before any other content, as opposed to at the side of it. Also, other boxes, such as infoboxes, are shown on the right of the screen, similarly to on a desktop.

TheDJ renamed this task from Wikipedia examples sidebar on mobile to navigational sidebar on mobile, should float on wide screens..Mar 13 2017, 3:08 PM

This seems an artefact from the times where minerva was exclusively for narrow screens. Infobox float on tablet, so an element like this should be possible to be fixed as well.

BTW. I've added vertical-navbox class to this template now, which hides it fully, like any other navbox.. That too is something that should be considered to be limited devices below the tablet width btw...

@TheDJ wow this is old - had completely forgotten about it. Anyway, the examples box on
this page does not display at all on my iPad anymore.

Izno claimed this task.
Izno subscribed.

I am closing this resolved. This template no longer exists and I've taken care of the substed uses.

For ad hoc floating things (usually tables) that should perhaps behave differently, probably should look at my suggestion at T78176#7093411 (which should perhaps live somewhere in the context of that task's merged-into-duplicate).