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

Popular posts from this blog

javascript - How to get current YouTube IDs via iMacros? -

c# - Maintaining a program folder in program files out of date? -

emulation - Android map show my location didn't work -