gpt4 book ai didi

html - Div 不会环绕 Firefox 中的内容

转载 作者:行者123 更新时间:2023-11-28 18:29:12 25 4
gpt4 key购买 nike

我无法让容器在 Firefox 中正确环绕视频。 Chrome 和 IE 工作正常。这是网站:http://www3.carleton.ca/clubs/sissa/html5/video.html

enter image description here

HTML:

<div id="video_container">
<video id="trailers" poster="poster.jpg">
<source src="vLast.mp4" type="video/mp4">
<source src="vLast.webm" type="video/webm">
</video>
<nav>
<div id="controls">
<button id="playButton">Play</button>
<div id="vol" onclick="showSlider()">Vol
<div id="containSlider">
<input type="range" id="vSlider" min="0" max="1" step="0.1" value="0.5"/>
</div>
</div>
<div id="defaultBar">
<div id="progressBar"></div>
</div>

<button id="mute">Mute</button>
<button id="full" onclick="toggleFullScreen()">Full</button>
</div>
<div id="playlist" class="animated fadeInRight">
<div class="thumb" id="tb1"><img src="TbGow.jpg" onClick="changeTrailer('vGow')"/></div>
<div class="thumb" id="tb2"><img src="TbLast.jpg" onClick="changeTrailer('vLast')"/></div>
<div class="thumb" id="tb3"><img src="TbTwo.jpg" onClick="changeTrailer('vTwo')"/></div>
</div>
</nav>
</div>

CSS:

#video_container{
-webkit-box-flex: 1;
-moz-box-flex: 1;
border:5px solid black;
margin: 20px;
padding: 0px;
width:100%;
height:100%;
position: relative;
background-color:white;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
#video_container video{
width: 100%;
height: auto;
display: block;
z-index: 9999;
}

最佳答案

仅供引用 Mozilla Firefox 是唯一仍然不支持 flex-wrap 的浏览器。它仅支持单行 flexbox。 (flex-wrap 需要多行 flexbox)。

功能 Firefox (Gecko)- 不支持 Chrome
- 21.0-webkitIE浏览器- 10.0-moz歌剧
- 全面支持 12.10傲游- 全面支持 4.0

https://developer.mozilla.org/en-US/docs/CSS/flex-wrap

我目前正在寻找解决方案...

关于html - Div 不会环绕 Firefox 中的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14814307/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com