0

css

#content2
    {
    clear:both;
    width:1024px;
    height:auto;
        position:relative;
    }
    #content2 div:first-child
    {
    background:#E4ECF7;
    width:445px;
    height:25px;
    margin:15px 0px 0px 223px;
    -webkit-border-radius:5px;
    -moz-border-radius:5px;
    border-radius:5px;
    border:1px solid #E0DCD1;
    padding:5px 0px 0px 5px;
    position:absolute;
    }
    #content2 div:last-child
    {
    width:1024px;
    height:200px;
    position:absolute;
    border:1px solid #E0DCD1;
    clear:both;
    }

html

<div id="content2">
<div>content</div>
<div>content</div>
</div>

结果

div1 显示在div2内部

我需要

div1  then
div2

请帮我。

4

5 回答 5

2

为什么使用绝对位置，最后一个孩子不需要明确的属性

#content2
{
clear:both;
width:1024px;
height:auto;
    position:relative;
}
#content2 div:first-child
{
background:#E4ECF7;
width:445px;
height:25px;
margin:15px 0px 0px 223px;
-webkit-border-radius:5px;
-moz-border-radius:5px;
border-radius:5px;
border:1px solid #E0DCD1;
padding:5px 0px 0px 5px;
/*position:absolute;*/
}
#content2 div:last-child
{
width:1024px;
height:200px;
/*position:absolute;*/
border:1px solid #E0DCD1;
/*clear:both;*/
}

div 默认被清除，除非在使用 float 属性之后

于 2012-07-06T07:39:16.530 回答
1

从两个子 div 中删除绝对位置...

于 2012-07-06T07:45:56.820 回答
0

我认为你看起来像这样：- http://tinkerbin.com/3qRLgscO

实际上，您自己使CSS有点复杂。您可以通过非常简单的 CSS 获得所需的结果，而无需使用positioning.

如果我们使用float比我们应该使用clear清除浮动 div 的，否则不需要使用该clear属性。

这是您的简单代码，我在您的CSS中进行了一些简单的更改.....

HTML

<div id="content2">
<div>div1</div>
<div>div2</div>
</div>

CSS

#content2 {
    background: none repeat scroll 0 0 red;
    height: 200px;
    width: 1024px;
}
#content2 div:first-child {
    background: none repeat scroll 0 0 #E4ECF7;
    height: 45px;
}

#content2 div:last-child {
    background: none repeat scroll 0 0 yellow;
    border: 1px solid #E0DCD1;
    height: 45px;
}

我希望这能帮到您........

于 2012-07-06T07:50:08.523 回答
0

您可以在 div 类中使用以下属性。

float:left
clear:right;
于 2012-07-06T07:58:34.407 回答
0

如果您正在使用Position: absolute;为两个 div 指定边距。

例如：

#content2 div:last-child
    {
    width:1024px;
    height:200px;
    position:absolute;
    margin-top: xxx; /* specify the top margin */
    border:1px solid #E0DCD1;
    clear:both;
    }
于 2012-07-06T07:40:59.797 回答