Javascript 如何将HTML对象与封面垂直对齐

我有大约10个或更多的物体，宽度相同但高度不同。我想把它们像下面的图片一样，完全覆盖这一页。以下是我所做的，但不起作用：

HTML:

不具有相同高度的对象之间存在间隙。。。我希望它消失。有什么想法吗

谢谢

---

你是说像这样的事吗？ 我加了两个div

.left{
    float:left;
    width:200px;
}
.right{
    float:left;
    margin-left:18px;
    width:200px;
}

---

实际上，没有css方法可以在不操纵dom的情况下实现它。在您的例子中，您可以在左侧和右侧添加列来构造元素，以避免gab

您还可以使用类似于

请看以下答案：

尝试发现css3列属性。 也许这个来源可以帮助你：

使用以下方法创建：

var container=document.querySelector'book'； var msnry=新的Masonrycontainer{ //选择权 列宽：100， itemSelector:“.book”， 保证金：0自动； }; 身体{ 填充：25px； } 书{ 文本对齐：居中； 外形：5px固体水； } .书{ 宽度：45%； 边框：1件银点； 背景颜色：粉红色； 利润率：9px； 文本对齐：居中； } ... ... ... ... ... ... ...

---

看一看css专栏的确切内容。。。但不幸的是，我无法访问对象。我不能把它们分为不同的部分，因为我使用wordpress，它会自动发布帖子。

   body{padding:25px;}
#book{text-align:center;outline:5px solid aqua;}
.book{
    display:inline-block;

    border:1px dotted silver;background-color:pink;margin:9px;text-align:center;
}

.left{
    float:left;
    width:200px;
}
.right{
    float:left;
    margin-left:18px;
    width:200px;
}