Centering HTML object

General Discussion
  • I'm using the HTML widget to display HTML5 video on the top-right portion of my forum. However, when the browser-width decreases to something like a tablet, and the bootstrap column is switched to a row, the video is not centered. I've tried adding `style="margin-left:auto; margin-right:auto;text-align:center;" to my <video> tags.

    Any other way to center it in the tablet/phone display size?

  • @Guiri Have you supplied a width to the video?

  • @a_5mith Yup. 320x240, roughly, because that seemed to fit nicely in the sidebar on Vanilla. But if there's a way to have it autosize, I'd be find with that. Maybe width:100%; max-width:400px or something

  • @Guiri Use percentage rather than pixels. Set your width to 96%, then your left and right margins to 2% each. Then set your height to something that looks ok on your sidebar. As most will just full screen on tablet, so doesn't matter on the height there.

    You also don't really need a max-width as it will just fill the sidebar container.


Suggested Topics