0

我正在尝试创建一个包含一系列 100% .containerdiv 的页面（每个 div 内部都有自己的 div），从而导致单页设计很长。但是，当我从中删除边框时.container，它们都会崩溃。

有人知道为什么会这样吗？

  .container {

        width: 100%;
        height: 100%;
        margin: 0;
        padding: 0;
        display: block;
        border: 1px solid salmon;

    }

html, body {

    width: 100%;
    height: 100%;
    margin: 0px;
    padding: 0px;
    font-family: sans-serif;
    font-size: 10pt;
    letter-spacing: 1px;
    /* overflow: hidden; */
}

编辑：我已经改变了.container从display:block;到display:inline-block;，这已经解决了这个问题。有谁知道为什么会这样？

4

1 回答 1

0

用户splattne在类似问题上的回答。

====

想象一下 a<span>中的一个元素<div>。例如，如果你给<span>元素一个 100px 的高度和一个红色边框，它看起来像这样

显示：内联

显示：内联

显示：内联块

显示：内联块

显示：块

在此处输入图像描述

代码：http: //jsfiddle.net/Mta2b/

更多信息：

display: block
它将导致容器内的div其他内容强制divs到新行，从而创建空间和折叠设计。

display: inline-block
它试图将 显示div在与其他相同的行上，divs但由于你所有的divs都有width:100%，所以尽管它们是水平对齐的，但它们在垂直方向上看起来像一个接一个。

于 2013-08-09T13:23:28.597 回答