如何防止覆盖div在底部创建额外的空间？
如何防止覆盖div在底部创建额外的空间？
提问于 2016-08-09 19:34:34
我在我的网站上有一个HTML5视频，它被一个div覆盖，为它添加了一种冷色，但出于某种原因，它在底部和我的网站中的下一节之间创造了额外的空间(参考图片)
正如你所看到的，紫色的覆盖层和黄色的部分之间有一个很小的差距，基本上，覆盖是不适应视频的。
HTML:
<div id="vid-overlay"></div>
<div class="vid-container">
<video autoplay loop>
<source src="video/Hello-World2.mp4" type="video/mp4"></source>
<source src="video/Hello-World2.webm" type="video/webm"></source>
</video>
</div>CSS:
video{
width:100%;
height:auto;
display:block;
float:left;
margin:0;
padding:0;
}
#vid-overlay{
background: rgba(96,80,99,1);
background: -moz-linear-gradient(top, rgba(96,80,99,1) 0%, rgba(96,80,99,0.51) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%,
position:absolute;
margin:0;
padding:0;
width:100%;
height:100%;
}回答 2
Stack Overflow用户
发布于 2016-08-09 19:38:56
对于您在position:absolute div中的需求，是否需要vid-overlay。
如果不尝试：position:relative。这可能解决您的覆盖错误。
Stack Overflow用户
发布于 2017-07-27 00:15:21
视频标记默认为内联块。您需要将其显示为如下块元素：
video {display: block;}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/38859045
复制相关文章
相似问题
腾讯云开发者
