WordPress.org

Make WordPress Core

Opened 3 years ago

Last modified 10 months ago

#39616 new defect (bug)

Twenty Seventeen: Issue with Header Video

Reported by: tentblogger Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 4.7.1
Component: Bundled Theme Keywords: reporter-feedback
Focuses: Cc:
PR Number:

Description

via https://wordpress.org/support/topic/issue-with-the-header-video/#post-8665585

Upgrade of the theme and the WP (4.7.1) messed up the header video.

Now there’s a big black bar at the top and bottom (wasn’t there in the previous version(s)).

I've checked on a variety of browsers (all updated to the newest versions):

firefox
http://john.do/wp-content/uploads/2017/01/firefox.png

safari
http://john.do/wp-content/uploads/2017/01/safari.png

chrome
http://john.do/wp-content/uploads/2017/01/chrome-1.png

Change History (10)

#1 follow-up: @SergeyBiryukov
3 years ago

  • Summary changed from Issue with Header Video to Twenty Seventeen: Issue with Header Video

#2 @davidakennedy
3 years ago

@tentblogger Thanks for the report, and welcome to Trac!

A few questions for you:

  1. Does this occur if you use an older version of the theme – 1.0?
  2. Are you using an uploaded video or YouTube one?
  3. What happens if you remove and add the video back?
  4. Do you have this live on a site somewhere I can look at?

I have a hunch that this may be due to the content width changes made on the 1.1 version of Twenty Seventeen. See: r39635.

The content width had to be changed because it was flat out wrong, so it made sense to make such a big change.

#3 @davidakennedy
3 years ago

  • Keywords reporter-feedback added

#4 @tentblogger
3 years ago

Nope. Was working fine with the initial release.
YouTube.
I've tried different videos and formats. Same result.
http://john.do

#5 in reply to: ↑ 1 @ohkevmanaol
3 years ago

Uh...is anything being done about this?

#6 @davidakennedy
3 years ago

Sorry I haven't doubled back to this sooner.

I investigated a bit more this morning, and haven't made much progress:

  • I tested on an older version of the theme, so I don't think r39635 is the culprit.
  • This only seems to happen with YouTube embeds.
  • YouTube seems to set a fixed with and height on its <video> element. I think this could be part of the problem.

I plan to investigate some more this weekend.

Pinging @joemcgill and @bradyvercher for help and ideas.

#7 @bradyvercher
3 years ago

YouTube does resize the video element within the iframe to ensure it always fits within the screen, but I wasn't able to replicate the behavior in those screenshots. #39893 might be related and has some code I wrote to make YouTube video headers full screen.

#8 @davidakennedy
3 years ago

@bradyvercher Thanks for chiming in! I was able to replicate what was in the screenshots using his video and another one.

I did notice the resize thing with YouTube, and that seems to be the primary cause of this. So #39893 is definitely related.

#9 @swissspidy
3 years ago

#40378 was marked as a duplicate.

#10 @here
10 months ago

Possibly related to #40522

Note: See TracTickets for help on using tickets.