html - Setting width and height of the video -
i facing problem regarding width , height of video. right now, occupying full screen want full sized in width , setting height want. example, refer http://airbnb.com. if me out.
<div align="center"> <video autoplay loop id="video" class="con"> <source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4> </video> <div class="overlay"> <form> <label for="input">form input label</label> <input id="input" name="input" value="" /> <button type="submit">submit</button> </form> </div> </div>
this css using.
.con { position: fixed; top: 50%; left: 50%; min-width: 100%; min-height: 100%; width: auto; height: auto; transform: translatex(-50%) translatey(-50%); transition: 1s opacity; } .overlay { position:absolute; top:0; left:0; z-index:1; }
it seems you're trying make width of video wider height. change min-height 50%.
Comments
Post a Comment