jQuery操作DIV而不是其子元素

这是我的布局：

<div id="outerwrap">
    <div id="innerwrap">
        <div id="centerc">...</div>

        <div id="rightc" style="font-weight:bold">
        </div>
        <div style="background-color:White;height:10px;top:284px;left:0px"></div>

        <div id="leftc">..</div>
    </div>
    <div id="footer" ">...</div>
</div>


<style>
    #outerwrap {
        background-color: #EE44E7;
    }

    #innerwrap {
        background-color: #EE44E7;
        margin-right: 200px;
        top: 0px;
        height: 100%;
    }

    #leftc {
        position: absolute;
        top: 111px;
        left: 0px;
        width: 197px;
        background-color: #EE44E7;
        font-size: 10px;
    }

    #centerc {
        position: relative;
        margin-left: 199px;
        padding: 0px;
        background-color: white;
    }

    #rightc {
        position: absolute;
        top: 111px;
        right: 0px;
        width: 199px;
        color: blue;
        background-color: #EE44E7;
        font-size: 10px;
    }

    #footer {
        padding: 0px;
        margin: 0px;
        width: 100%;
        height: 62px;
        visibility: hidden;
    }
</style>

    #outerwrap
    {
       background-color: #EE44E7;
    }

    #innerwrap
    {
       background-color: #EE44E7;
       margin-right: 200px;
       top:0px;
       height:100%;
    }


    #leftc
    {
       position: absolute;
       top: 111px;
       left: 0px;
       width: 197px;
       background-color: #EE44E7;
       font-size: 10px;
    }

    #centerc
    {
       position: relative;
       margin-left: 199px;
       padding: 0px;
       background-color: white;
    }

    #rightc
    {
       position: absolute;
       top:111px;
       right: 0px;         
       width: 199px;
       color: blue;
       background-color: #EE44E7;
       font-size: 10px;
    }


#footer
    {
    padding: 0px;
    margin: 0px;
    width: 100%;
    height: 62px;
visibility: hidden;
    }

...
..
您应该将左div的样式设置为：

overflow: hidden;

这将防止显示和包装或溢出。
您可以发布div的内部控件代码吗？我已经用div的内容更新了问题（leftc），谢谢..我也这样做了..子元素仍然大小相同..我还注意到，如果我在leftdiv上调用hide（），所有的子元素也被隐藏。那么为什么宽度变化的行为不影响子元素呢？您期望的行为是什么？你认为当宽度改变时，像图像或充满文本的块这样的元素会以某种方式挤压自己吗？他们不会，他们只会尝试回流。
<div id="leftc">
    <!-- Google Search Box Start -->
    <div id="searchBox">
        <table border="0" cellpadding="0" cellspacing="0" width="100%">
            <tr>
                <td> <input name="ctl00$q" type="text" value="Google Custom Search" maxlength="100" id="ctl00_q" onclick="ctl00$q.value=''" onfocus="this.className = 'highlight';" onblur="this.className = '';" style="border-color:#94C7EF;border-width:1px;border-style:solid;" /></td>
                <td align="right">
                    <input type="image" name="ctl00$_btnSearch" id="ctl00__btnSearch" src="images/search.gif" alt="Search" onclick="javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions(&quot;ctl00$_btnSearch&quot;, &quot;&quot;, true, &quot;SearchGroup&quot;, &quot;&quot;, false, false))" style="border-width:0px;" />
                </td>
                <td width="5px" align="right">
                    <span id="ctl00__rfvQ" style="color:Red;visibility:hidden;"></span>
                    <input type="hidden" name="ctl00$cx" id="ctl00_cx" value="004354355454353138:kmy_68iupnm" />
                    <input type="hidden" name="ctl00$cof" id="ctl00_cof" value="FORID:11" />
                </td>
            </tr>
        </table>
    </div>
    <!-- Google Search Box End -->


    <br /><br />

    <div id="monthlabel">All this Month</div>
    <div id="monthall">
        <img id="ctl00_imgAuth" src="images/all/Jacor.jpg" style="border-width:0px;" /><br />
        <div style="margin-top:2px;"><a href="http://www.example.com/AllMonth.aspx">Jacor Jul</a></div>
    </div>
</div>

overflow: hidden;