WordPress.org
Get WordPress

Make WordPress Core

Opened 10 years ago

Closed 10 years ago

Last modified 9 years ago

#29867 closed defect (bug) (fixed)

Z-index competition between #wpadminbar and Twenty Eleven header at small screen sizes

Reported by: ericlewis's profile ericlewis Owned by: azaozz's profile azaozz
Milestone: 4.1 Priority: normal
Severity: normal Version: 3.8
Component: Toolbar Keywords: has-patch needs-testing
Focuses: ui Cc:

Description

Z-index on #wpadminbar is 99999 for devices larger than 782px, but drops to 500 for narrower devices.

This leads to issues like in the screenshot I'll attach.

We should keep the z-index high here, no?

Attachments (3)

Screen Shot 2014-10-05 at 9.04.44 AM.png​ (241.0 KB) - added by ericlewis 10 years ago.
29867.patch​ (379 bytes) - added by iseulde 10 years ago.
29867.1.patch​ (421 bytes) - added by babbardel 10 years ago.
Also, there is no need for "left: 0 !important;" as it is already declared 0 in the first place.

Download all attachments as: .zip

Change History (12)

@ericlewis
10 years ago

#1 @iseulde
10 years ago

I noticed this too.

@iseulde
10 years ago

#2 @iseulde
10 years ago

  • Component changed from Administration to Toolbar
  • Keywords has-patch added
  • Milestone changed from Awaiting Review to 4.1

Other than "Toolbar Touchification", there is no comment saying why it is reduced to 500...

#3 @iseulde
10 years ago

  • Keywords needs-testing added

Tested this in iOS 8 and it works fine. But since this was added specifically for a smaller width and made !important, it probably needs some testing in other mobile browsers.

Unless someone knows why this was added?

#4 @iseulde
10 years ago

  • Version set to 3.8

Introduced in [26134].

See https://core.trac.wordpress.org/ticket/25858#comment:29, and the relevant patch, https://core.trac.wordpress.org/attachment/ticket/25858/25858.responsive.diff.

@tollmanz, do you remember why you added that z-index: 500 !important;?

@babbardel
10 years ago

Also, there is no need for "left: 0 !important;" as it is already declared 0 in the first place.

This ticket was mentioned in ​Slack in #core by johnbillion. ​View the logs.
10 years ago

#6 @tollmanz
10 years ago

Hi @avryl!

Apologies for missing the ping in this ticket. @johnbillion mentioned this comment and I am just looking into it now.

I did not write that code, but assisted in merging the MP6 plugin into core, hence the reason the blame points to me. I went ahead and looked through the Github history to try to figure out why the !important was added. I tracked it down to a ​commit by @iammattthomas. Unfortunately, the commit message does not give us much information, but I believe @iammattthomas would be the next person to ask about it.

#7 @azaozz
10 years ago

As far as I remember the left: 0 !important; is override for an old fix for WebKit that did "strange" things to the first pixel on the screen on loading the page. Not needed any more as that fix was removed.

Don't see a need for the z-index: 500 !important; either, perhaps that was overriding something else that was removed.

#8 @azaozz
10 years ago

  • Owner set to azaozz
  • Resolution set to fixed
  • Status changed from new to closed

In 30764:

Admin toolbar: remove unneeded overrides of z-index and left on screens narrower than 782px. Props avryl, babbardel. Fixes #29867.

#9 @tywayne
9 years ago

#30242 was marked as a duplicate.

Note: See TracTickets for help on using tickets.