Wie macht man ein Div, um zwei Float Divs darin zu wickeln?

Question

Dec 04, 2009, 02:02 AM

Wie macht man ein Div, um zwei Float Divs darin zu wickeln?

Ich weiß nicht, ob es ein häufiges Problem ist, aber ich kann die Lösung noch nicht im Web finden. Ich möchte, dass zwei Divs in einem anderen Div gewickelt werden, aber diese beiden Divs müssen auf der gleichen Ebene ausgerichtet sein (zum Beispiel: Links nimmt man 20% der Breite des WrappedDiv ein, rechts nimmt man weitere 80%). Um diesen Zweck zu erreichen, habe ich das folgende CSS-Beispiel verwendet. Jetzt hat der Wrap DIV jedoch nicht alle Divs gewickelt. Die Wrap Div hat eine geringe Höhe als die beiden darin enthaltenen Divs. Wie kann ich sicherstellen, dass der Wrap Div die größte Höhe als die enthaltenen Divs hat? Vielen Dank!!!

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
        "http://www.w3.org/TR/html4/loose.dtd">
<html lang="en">
<head>
    <meta http-equiv="content-type" content="text/html; charset=iso-8859-1">
    <title>liquid test</title>
    <style type="text/css" media="screen">
        body
        {
            margin: 0;
            padding: 0;
            height:100%;
        }
        #nav
        {
            float: left;
            width: 25%;
            height: 150px;
            background-color: #999;
            margin-bottom: 10px;
        }

        #content
        {
            float: left;
            margin-left: 1%;
            width: 65%;
            height: 150px;
            background-color: #999;
            margin-bottom: 10px;
        }       
        #wrap
        {
          background-color:#DDD;
          height:100%;
        }

</style>
</head>
<body>
<div id="wrap">
    <h1>wrap1 </h1>
    <div id="nav"></div>
    <div id="content"><a href="index.htm">&lt; Back to article</a></div>
</div>
</body>
</html>