-2

父#Connect 有两行#unit1 和#unit2。每行有两列 .col1 和 .col2。我有两个问题：

  1. #Connect 仅与 #unit1 一样下降 - 所以我看不到蓝色背景。我希望 #Connect 与浏览器一样宽，但与它的内容一样高。
  2. 我希望#unit1 和#unit2 的背景与#Connect 一样宽，与.col2 一样高。目前，我看不到任何背景。

下面是代码：

<html>
    <head>
        <title></title>
        <link type="text/css" href="colReflow.css" rel="stylesheet">
        <style>
            #connect .col1{
                float: left; width: 240px; background-color: #ffc0cb;
            }
            #connect .col2{
                background-color: yellow; margin-left: 248px;
            }
            #connect .offCont{
                position: relative; top: 0; left: 0; float: left;
                width: 210px;height:256px;
                color: #000000;
                font-family: "TrumpGothicEastBold",Arial,helvetica,sans-serif;
                text-transform: uppercase;
                margin: 10px 10px 0 0;
                background: #9acd32;
            }
            #connect .section{
                /*I want the background to be as 100% width of Connect and the height of the contents of col2*/
                background: #ff69b4;clear: both; width: 100%;
            }
        </style>
    </head>
    <body>

        <div id="connect">

            <div id="unit1" class="section">
                <div class="col1">This column is used solely to hold this area.</div>

                <div class="col2">
                    <div class="offCont">drgdrg</div>
                    <div class="offCont">drgdrg</div>
                    <div class="offCont">drgdrg</div>
                    <div class="offCont">drgdrg</div>
                </div>
            </div>

            <div id="unit2" class="section">
                <div class="col1">This column is used solely to hold this area.</div>

                <div class="col2">
                    <div class="offCont">I want this section or unit 2 to be as tall as the contents of col2</div>
                    <div class="offCont">drgdrg</div>
                    <div class="offCont">drgdrg</div>
                    <div class="offCont">drgdrg</div>
                </div>
            </div>
        </div>

    </body>
</html>
4

1 回答 1

-1

放

overflow: hidden;

在 #connect 和 .section

于 2013-02-14T19:10:39.180 回答