主div不包含其他div

Question

主div不包含其他div

我一直在寻找一个解决方案,就像一两天,但由于我不习惯编写Web应用程序,我似乎无法找到问题..

我有一个预感,它与我左边浮动两个div有关.

问题是为什么我的主要div不包含整个页面？

这是我的HTML ..!

<body onLoad="initializePage()">
<script type="text/javascript">
        $('#Button1').click(function() {

        });
    </script>
<input type="button" id="Button1" value="korv" onClick="hidedivs()" />
<div id="main">
    <div id="searchholder">
        <div id="slider" class="searching"></div>
    </div>
    <div class="left">
        <asp:Repeater ID="Repeater1" runat="server">
            <HeaderTemplate>
                <table id="mytable" cellspacing="0">
                <thead>
                    <tr>
                        <th scope="col" abbr="Sidor/Artiklar" class="nobg">Sidor/Artiklar</th>
                        <th scope="col" abbr="Mozrank">MozRank</th>
                        <th scope="col" abbr="PR">PR</th>
                        <th scope="col" abbr="Dual 1.8GHz">Fri tillgång</th>
                        <th scope="col" colspan="2" abbr="Dual 2.5GHz">Välj själv</th>
                    </tr>
                </thead>
            </HeaderTemplate>
            <ItemTemplate>
                <tr data_id='<%# DataBinder.Eval(Container.DataItem, "pr_domain")%>'>
                    <th scope="row" abbr="Model" class="spec"><%# DataBinder.Eval(Container.DataItem, "namn_domain")%> </th>
                    <td class="alt" ><%# DataBinder.Eval(Container.DataItem, "moz_domain")%></td>
                    <td class="alt"><%# DataBinder.Eval(Container.DataItem, "pr_domain")%></td>
                    <td class="alt"><b></b>
                        <input type='<%# DataBinder.Eval(Container.DataItem, "type_domain")%>' name='<%# DataBinder.Eval(Container.DataItem, "idtag_domain")%>' value='<%# DataBinder.Eval(Container.DataItem, "faccess_domain")%>' onClick="calculatePrice();disableTB(this.name);" />
                        "Fri tillgång" </td>
                    <td class="alt"><input type="radio" name='<%# DataBinder.Eval(Container.DataItem, "idtag_domain")%>' value="0"  onclick="calculatePrice();enableTB(this.name, this.checked)" />
                        "Skriv ditt antal själv" </td>
                    <td class="alt" data_id='<%# DataBinder.Eval(Container.DataItem, "pr_domain")%>'><input type="text"  name='<%# DataBinder.Eval(Container.DataItem, "moz_domain")%>' id='<%# DataBinder.Eval(Container.DataItem, "idtag_domain")%>'  Enabled="false" Width="40px" onKeyUp="calculatePrice()" style="background-color:#eeeeee" /></td>
                </tr>
            </ItemTemplate>
            <FooterTemplate>
                </table>
            </FooterTemplate>
        </asp:Repeater>
    </div>
    <div id="pricingdetails" class="price">Priset för dina artiklar blir: </div>
</div>

Run Code Online (Sandbox Code Playgroud)

我的.css风格是

.price
{
 font-family:"Verdana";
 font-size:40px;
 color:Green;
 float: left;
 border-right: 1px solid #C1DAD7;
 border-bottom: 1px solid #C1DAD7;
 border-top: 1px solid #C1DAD7;
 color: #797268;
 font: bold 10px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
 background: -moz-linear-gradient(center top , #FFFFFF 0%, #EDEDED 100%) repeat scroll 0 0 transparent;
 display: inline; 
 }

 div.searchholder
{
position: absolute;
top: 0px;
left: 50%;
margin-left: -70px;
width: 480px;    
}

div.main
{
}

div.left
{
float: left;  
}
.searching
{
}

Run Code Online (Sandbox Code Playgroud)

Answer 1

Chr*_*ris 5

这里的问题是,由于你内部的元素#main div是浮动的,因此它们被认为与你的流不同div,因此它不会调整大小以适应它们.解决这个问题的方法是:

添加overflow: hidden;到您的#main样式.
#main通过添加浮动你的float: left;.
将此附加到您的#main div:( <div style = "clear: both;"></div>这是最不可取的方法).

归档时间：	13 年，2 月前
查看次数：	2642 次
最近记录：	13 年，2 月前