ビデオはクロムAndroidのブラウザ

Question

中の親の境界線から外れ

私のコードは、HTML

div { 
    position: relative; 
    border: 1px solid #333333; 
    margin-top: 5px; 
} 
video { 
    display: block; 
    width: 100%; 
    height: auto 
} 

コードは、WindowsのChromeで正常に動作します

<div> 
<video controls> 
    <source src="example.com/video.mp4" type="video/mp4"> 
</video> 
</div> 

で、Firefoxの、エッジ、およびサムスンでbrwoser、アンドロイド https://www.dropbox.com/s/nwiqen8ya7xw9ye/2016-10-22%2008.28.11.png?dl=0

Answer 1

が

を追加します。ここではFirefoxのではなく、アンドロイド、クロムはイメージですメディアと

メタプロパティ

name="viewport" content="width=320px, initial-scale=1" 

---

その後

@viewport{ 
    zoom: 1.0; 
    width: extend-to-zoom; 
} 

Answer 2

プレイはあなたの親HTMLとCSSを追加でき

@media screen and (-webkit-min-device-pixel-ratio:0) { 
    /*your rules for chrome*/ 
    div{ 
     //Codes 
     } 
    video{ 
     //codes 
     } 

}