search

muxinc / media-chrome

Custom elements (web components) for making audio and video player controls that look great in your website or app.
https://media-chrome.org
MIT License
1.21k stars 62 forks source link

Safari video is not bottom aligned with controls #754

Closed luwes closed 7 months ago

luwes commented 11 months ago

only happens with custom video elements https://github.com/muxinc/custom-media-element

SCR-20231028-i40

luwes commented 11 months ago

setting height: fit-content on the custom media element instead of the one of 100% set by the media container seems to be a workaround for Safari. https://github.com/muxinc/media-chrome/pull/743/commits/6708acab390ef2a4e9ad44cf063a9e5613468b62

Not sure if it should be added in media-container because it looks like a Safari bug related to aspect-ratio and custom elements

luwes commented 11 months ago

it's not specific to custom elements it seems. max-width and aspect-ratio on a container and width = height = 100% on child https://codesandbox.io/s/safari-aspect-ratio-height-bug-l363g6?file=/index.html

luwes commented 11 months ago

Bug was already reported https://bugs.webkit.org/show_bug.cgi?id=261556