Home/ Questions/Q 8485903
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-10T20:46:58+00:00

I have been looking for a solution for this for like a day or

  • 0

I have been looking for a solution for this for like a day or two but as I’m not used to coding web applications I can’t seem to find the problem..

I have a hunch it has to do with that I do float two divs to the left.

Question is why doesn’t my main div enclose the whole page?

This is my 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>

And my .css styles are 

.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
{
}
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    The issue here is that since the elements inside your #main div are floated, they’re considered in a different flow than your div, and thus it doesn’t resize to fit them. Ways to fix this are:

    • Add overflow: hidden; to your #main styling.
    • Float your #main by adding float: left;.
    • Append this to your #main div: <div style = "clear: both;"></div> (this is the least preferable method).
    • 0