父母不与漂浮的孩子一起成长

时间:2011-07-28 09:57:48

标签: css

我有一个问题,我的浮动儿童div不与我的父div一起成长。有没有办法来解决这个问题?我需要包装器在div中的100%内容。这是html;

<body>

    <div id="wrapper">

        <div id="leftpane">

            <div id="lefthead">

                <div id="leftheadfiller">

                </div>

                <div id="leftheadlogo">

                </div>

                <div id="leftheaddivider">

                </div>

            </div>

            <div id="leftcontent">

            </div>

        </div>

        <div id="rightpane">


            <div id="righthead">

                <div id="rightheadfiller">

                </div>

                <div id="rightheadlogo">

                </div>

                <div id="rightheaddivider">

                </div>

            </div>


            <div id="navigation">

                Properties Careers About Blog Advertise Contact

            </div>


            <div id="rightcontent">

            </div>


        </div>


        <div id="close">

        </div>

    </div>


</body>

这是css;

html,body {
background-image:url('images/background.gif');
background-repeat: repeat-y;
background-position: center;
background-attachment: fixed;
height: 100%;
width: 100%;
margin: 0px;
}

#wrapper {
background-color: aqua;
height: 100%;
width: 866px;
margin-left: auto;
margin-right: auto;
}

#leftpane {
background-image: url('images/darkbackground.gif');
width: 326px;
height: 100%;
float: left;
}

#lefthead {
height: 132px;
width: 100%;
}

#leftheadfiller {
height: 75px;
width: 100%;
}

#leftheadlogo {
background-image: url('images/index_07.gif');
width: 71px;
height: 56px;
float: right;
}

#leftheaddivider {
height: 1px;
width: 100%;
background-image: url('images/lightbackground.gif');
float: right;
}

#lefttcontent {
height: 100%;
background-color: fuchsia;
}

#rightpane {
background-image: url('images/lightbackground.gif');
width: 540px;
height: 100%;
float: right;
}

#righthead {
height: 132px;
width: 100%;
}

#rightheadfiller {
height: 75px;
width: 100%;
}

#rightheadlogo {
background-image:url('images/index_09.gif');
width: 109px;
height: 56px;
float: right;
}

#rightheaddivider {
height: 1px;
width: 100%;
background-image: url('images/darkbackground.gif');
float: right;
}

#navigation {
margin-top: 2px;
font-family: Arial, Helvetica, sans-serif;
color: #A3A3A3;
font-size: 14px;
word-spacing: 44px;
text-align: center;
width: 100%;
height: 18px;
}

#rightcontent {
padding-left: 6px;
background-color: fuchsia;
}

#close {
clear: both;
}

有没有办法解决这个问题?我在本地服务器上的临时文件夹上设置了这个:

http://68.113.27.229/test

我需要强制包装器增长的两个div是Leftcontent和Rightcontent。

谢谢!

1 个答案:

答案 0 :(得分:3)

overflow: hidden添加到父div元素。

如果您不希望隐藏溢出的内容,请尝试以下操作:

将其作为包装div中的最后一个div插入。

<div style="clear: both"></div>