Question

我希望我的'header'div位于'container'div中。目前'header'db位于'container'div上方，我似乎无法将其放入其中。下面是编码。谢谢你的帮助。

HTML：

<body>
<div id="container">
        <div id="header">
            <h1>Title Goes Here</h1>
        </div>    
    </div>
</body>

CSS：

#body {
    background-color: #CCC;
}

#container {
    width: 960px;
    height: 800px;
    background-color: #666;
    margin: 0 auto 0 auto;
}

#header {
    position: relative;
    width: 956px;
    height: 100px;
    background-color:#FFF;
    border-style: solid;
    border-color: #F00;
    border-width: 2px;
    text-align: center;
    line-height: 3em;
}

Answer 1

它在里面。删除标题上的背景颜色，您将看到背后的容器背景。

Answer 2

它位于容器内部，由于颜色的原因，它看起来就像是在顶部。打开你喜欢的w / e浏览器工具，看看容器div。

Answer 3

它在你的容器里面。添加填充或删除背景将使其更加可见

jsfiddle

#body {
    background-color: #CCC;
}

#container {
    width: 960px;
    height: 800px;
    background-color: #666;
    margin: 0 auto 0 auto;
    padding:20px;
}

#header {
    position: relative;
    width: 956px;
    height: 100px;
    background-color:#FFF;
    border-style: solid;
    border-color: #F00;
    border-width: 2px;
    text-align: center;
    line-height: 3em;
}

Answer 4

将背景颜色设置为透明或暂时将其删除，您会看到标题位于其中

在另一个div里面坐div？

4 个答案: