The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums Design Video hidden in bottom.. not in the right place.

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
  • #257035

    Hi guys :D

    I need some help with my video.
    I am pretty sure I’m doing something wrong.. just don’t knwo what.
    My video is kind of stuck and a part is hidden in the bottom when the window isn’t in fullscreen..
    Actually it should be like on this page: But instead of an image it has to be this video.
    Any Idea why this is happening?

    Thanks for help!

    PS: Sorry for my english..



    I would make the video act responsive according to a solution you can find anywhere.
    Wrap the video in a container like this:

    <div class="video-container">
      <video src="" width="1920" height="1080" 
     autobuffer autoplay loop ></video>

    And then use the styling:

    .video-container {
      position: relative;
      padding-bottom: 56.25%;
      padding-top: 30px;
      height: 0;
      overflow: hidden;
    .video-container video {
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;

    Because of overflow-y: hidden; on both html and body and also on .container2, the video is just partly visible and the page doesn’t scroll.

    If you want it to fit in the page without scrolling, I would search for responsive background video’s like here for example:


    Thanks for answering!

    Ya.. actually I really don’t want that it scrolls.

    But thanks. I will try and If doesn’t work, I will ask again ;P


    Can I do this responsive background video also with this paddings arround like on this page?

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘Design’ is closed to new topics and replies.