Jump to content

Videos: vertical exceeds screen height


Recommended Posts

I noticed something today when my better half attached and embedded videos which had been shot vertically; since they stretched to fill the horizontal container space, their full height extended beyond the page height.

I fixed it in our case by adding a class 'vertical' to the HTML of the video and the CSS

video.vertical {
  max-height: 100vh; 
  width: auto; 
  position: relative; 
  top: 50%; 
  left: 50%; 
  transform: translate(-50%,0);

Obviously, it's not ideal for users to have to manually enter a CSS class every time they upload a vertical image, so I thought it would be something the core software might handle if it could detect the orientation.

Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Create New...