[wp-trac] [WordPress Trac] #30078: Video dimensions in MediaElement

[WordPress Trac]

#30078: Video dimensions in MediaElement
--------------------------+------------------
 Reporter:  azaozz        |       Owner:
     Type:  defect (bug)  |      Status:  new
 Priority:  normal        |   Milestone:  4.1
Component:  Media         |     Version:  4.0
 Severity:  normal        |  Resolution:
 Keywords:                |     Focuses:  rtl
--------------------------+------------------

Comment (by jessepollak):

 OK, I did some looking into this. This is happening because the inner
 `video` height is shrinking (width & height changed with JS in
 mediaelement.js) while the outer `div.wp-video` container has the fixed
 height. That creates the big gap of whitespace underneath.

 One potential solution is to remove the inline height style — this works
 correctly if we: (1) start with a large screen size, then shrink the width
 so the max-width rule applies; (2) don't change the screen width at all.
 However, this fails if we start with a small screen size (where the max-
 width rule applies) and then expand the window width so it no longer does.

 In the failure case, the width of the video stays correct, but the height
 is fixed at the original, shorter height (skewing the video with an
 incorrect aspect ratio). This happens because for some reason
 mediaelement.js does not change the height if it loads as less then the
 auto height from the set width. I'm attaching two screenshots below that
 show this happening. This may be a bug upstream in mediaelement.js, but I
 don't know the code well enough to comment on that.

--
Ticket URL: <https://core.trac.wordpress.org/ticket/30078#comment:1>
WordPress Trac <https://core.trac.wordpress.org/>
WordPress publishing platform