css - How do I center an HTML5 video horizontally and vertically in a bare bones HTML document? -


this question has answer here:

let's have very simple html page single html5 video element. it's source code is:

<html>     <head>         <title>{title}</title>     </head>     <body>         <video height="{height}" width="{width}" controls="">             <source src="{source}" type="{type}"/>         </video>     </body> </html> 

what can center video element both horizontally , vertically in web browser? i'd prefer css solution or @ least solution uses little in way of hackish techniques possible, i'll take can get.

use following css make video element center vertically , horizontally.

video {     left: 50%;     position: absolute;     top: 50%;     transform: translate(-50%, -50%); } 

working fiddle


Comments

Popular posts from this blog

how to insert data php javascript mysql with multiple array session 2 -

multithreading - Exception in Application constructor -

windows - CertCreateCertificateContext returns CRYPT_E_ASN1_BADTAG / 8009310b -