html - 如何无缝显示两个html元素

Question

我的网页显示 youtube iframe，比如 YOUTUBE，和一个水平的 div 元素，比如 CAPTION。具体来说，按照垂直顺序，CAPTION 的顶部紧跟在 YOUTUBE 的底部之后。两者几乎是连在一起的。但是它们之间有一些狭窄的空间。我不需要它。您如何消除两者之间不必要的空间？ 以下是网页的代码和图像。 对于代码，第一个 <div>代表 YOUTUBE 和 <demo-caption>代表 CAPTION，这是一个只有 div 元素的谷歌聚合物元素。我想您不需要了解 google polymer 就可以回答我的问题。 更详细地说，除了将两个元素居中之外，我没有必要为页面应用任何 css。

               <div id="player" class="main" ></div>
　　　　　　　　<demo-caption ></demo-caption> 

Answer 1

您必须检查这两个元素以查看它们是否有任何不必要的填充或边距，您可以在 chrome 中通过 ctrl+shift+I 或右键单击该元素来执行此操作。

此外，您始终可以使用负边距来更改您的 div 位置

demo-caption{
    margin-top: -5px;
}

或者使用相对位置

demo-caption{
    position:relative;
    top: -5px;
}