Make WordPress Core

Opened 7 years ago

Closed 7 years ago

Last modified 7 years ago

#39557 closed defect (bug) (worksforme)

Twenty Seventeen: Wrong focus header image

Reported by: psychosopher's profile Psychosopher Owned by:
Milestone: Priority: normal
Severity: normal Version: 4.7
Component: Bundled Theme Keywords:
Focuses: Cc:


Using Edge as browser the focus of the header image on posts and pages is not the same as when using Firefox, Chrome or Opera.

Attachments (2)

seventeen_firefox.jpg (89.2 KB) - added by Psychosopher 7 years ago.
Screenshot Firefox
seventeen_edge.jpg (84.2 KB) - added by Psychosopher 7 years ago.
Screenshot Edge

Download all attachments as: .zip

Change History (6)

#1 @davidakennedy
7 years ago

Hey @Psychosopher – thanks for the report!

Can you clarify the issue? When you say, "focus of the header image", do you mean focusing on it with the keyboard or something else? How is it not the same?

A good format to follow for bug reports is this:

Steps to reproduce
1. Starting at URL:

What I expected

What happened instead

Browser / OS version

7 years ago

Screenshot Firefox

7 years ago

Screenshot Edge

#2 @Psychosopher
7 years ago

@davidakennedy, sorry for not being clear!

With focus I mean the center of the image or how the image is cut.

I added to screenshots.

Last edited 7 years ago by Psychosopher (previous) (diff)

#3 @davidakennedy
7 years ago

  • Milestone Awaiting Review deleted
  • Resolution set to worksforme
  • Status changed from new to closed

@Psychosopher Perfect! Thank you for taking the time to make things clearer. That really helps!

The reason you're seeing this isn't a bug. Twenty Seventeen uses a number of new CSS properties. Two of them are @supports and object-fit. In Twenty Seventeen, these are used in combination. Feature queries, or @supports, allows us to test if a browser can handle certain other CSS properties. In the theme, we use feature queries to test for object-fit in the header image/video area. Browsers that can use object-fit do so, and those that can't fall back to something else. object-fit lets us nicely fit and center images/videos in an area. So Firefox supports object-fit and it looks nice. Edge doesn't (yet), so it gets the fallback. More on that here:

So with that said, I'm going to close this since it's not a bug.

#4 @Psychosopher
7 years ago

Thank you for the explanation! Interesting.

Last edited 7 years ago by Psychosopher (previous) (diff)
Note: See TracTickets for help on using tickets.