Question

我在尝试在网站上展示这些视频容器时遇到了一些麻烦。这是example。我试图让网格差距在保证金上相等。现在，容器之间的水平边缘的宽度比垂直边缘厚。看起来我使用的保证金代码是使用环绕边距，当放置在彼此旁边时，边距加倍。我已经尝试过保证金权利和保证金左边，而且这些无利可图。

真的很感谢你的帮助！

代码如下：

#gallery { margin-top: 10px; margin-bottom: 100px;
}

.video-container {
    width: 310px;
    margin-right: 7px;
    height: 310px;
    border-radius: 0px;
    overflow: hidden;
    display: none; float: left;
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
    -moz-box-sizing: border-box;    /* Firefox, other Gecko */
    box-sizing: border-box;         /* Opera/IE 8+ */
    text-align: center;
    position: relative;
}

Answer 1

您的YouTube链接中的图片会在您的容器中添加垂直边距之前获得换行符（
）。例如：

<li>
    <a href="http://www.youtube-nocookie.com/embed/vcdMZrmdwKU?iframe=true&amp;width=853&amp;height=480" rel="prettyPhoto[iframes]">
    <br>
    <img src="http://8-playerpictures.com/wp-content/uploads/2014/04/Kinekt-Gear-Necklace.png" alt="Kinekt Design: Gear Necklace">

如果您可以找到它们的来源并消除它们，那么您可以使用普通的CSS控制容器的垂直间距。

晚上视频容器之间的边距空间

1 个答案: