Safari on iPad (iOS6) does not scale HTML5 video to fill 100% of page width

Question

I am using the following CSS to display a video in full width (100%) on a responsive HTML5 page. The native size of the video is 480x270. The video is scaled to fill the ful

Answer 1

you can use this to set center your video in container with margins as you want. no need to add extra element. fix for iOS 7 specially. pay attention to -webkit-calc prefixes if need

width: 100%;
position: absolute;
top: calc(50% - 10px);
left: 50%;
height: calc(100%);
-webkit-transform: translateY(-50%) translateX(-50%);