Question : div clear.

i have the following where do the div class=clear go?
<div class="profile-box">
<div class="profile-item">
<div class="pic">
<asp:HyperLink ID="HLMainPicID" runat="server" NavigateUrl='<%#"~/Secure/ViewProfile.aspx?UserName="+Eval("UserName") %>'>
<asp:Image ID="MainPicID" Style="vertical-align: middle" runat="server" />
</asp:HyperLink>
</div>
<div class="info">
<span class="srusername">
<%#DataBinder.Eval(Container,"DataItem.UserName")%></span>
<br />
<%#DataBinder.Eval(Container,"DataItem.Age")%> Years Old <%#DataBinder.Eval(Container,"DataItem.GenderName")%>
- <%#DataBinder.Eval(Container,"DataItem.ZodiacName")%> 
<asp:Image ID="imgZodiacSign" ImageUrl='<%# GetUrl(Eval("ZodiacName")) %>' Style="vertical-align: middle"
runat="server" />
<br />
<%#DataBinder.Eval(Container,"DataItem.HeightName")%> - <%#DataBinder.Eval(Container,"DataItem.BodyTypeName")%>
<br />
<%#DataBinder.Eval(Container,"DataItem.HairColorName")%> Hair, <%#DataBinder.Eval(Container,"DataItem.EyeColorName")%> Eyes<br />
<%#DataBinder.Eval(Container,"DataItem.EthnicityName")%>
<br />
<%#DataBinder.Eval(Container,"DataItem.GenderName")%> Seeking 
<%#DataBinder.Eval(Container,"DataItem.SeekingName")%>
<br />
<div class="loc">
<%#DataBinder.Eval(Container,"DataItem.CityName")%>, <%#DataBinder.Eval(Container,"DataItem.RegionName")%>,
 <%#DataBinder.Eval(Container,"DataItem.Country")%>
</div>
</div>
<div class="detail">
<span>
<%#DataBinder.Eval(Container,"DataItem.HeadLine")%></span>I really dont know
what to say, so here it goes. i'm a loner, im open minded,and im a smartass, plus
sometimes im 2 honest and blunt.
</div>
</div>
</div>

1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:
36:
37:
38:
39:
40:
41:
42:
43:
44:
45:
46:
47:
48:
49:
50:
51:
52:
53:
54:
55:
56:
57:
58:
59:
60:
61:
62:
63:
64:
65:
66:
67:
68:
69:
70:
71:
72:
73:
74:
75:
76:
77:



.profile-box
{
    border-left: solid 1px #fff;
    border-right: solid 1px #fff;
    float: left;
}

.profile-box .profile-item
{
    float: left;
    margin-bottom: 10px;
    padding: 5px 0;
    border: solid 1px #C5E0ED;
    width: 980px;
    background: #F0F8FF url(Images/BackGrounds/bl.png) repeat-x left bottom;
}

.profile-box .profile-item .pic
{
    float: left;
    padding: 5px;
    width: 120px;
    overflow: hidden;
}

.profile-box .profile-item .pic img
{
    border: solid 1px #C5E0ED;
    padding: 5px;
    background: #fff;
}

.profile-box .profile-item .info
{
    left: 100px;
    padding: 5px;
    width: 300px;
    overflow: hidden;
    margin-left: 5px;
    float: left;
    color: #666;
    line-height: 1.4em;
}

.profile-box .profile-item .info p
{
    color: #000;
}

.profile-box .profile-item .info a
{
    font-weight: bold;
    font-size: 0.9em;
}
.profile-box .profile-item .info a.loc
{
    color: #305B8C;
    font-weight: normal;
    font-size: 0.9em;
}

.profile-box .profile-item .info a.loc:hover
{
    color: #FF6600;
}

.profile-box .profile-item .detail
{
    overflow: hidden;
    padding: 5px;
}

.profile-box .profile-item .detail span
{
    display: block;
    font-weight: bold;
}

Answer : div clear.

No, you use float on the divs that you want to move to the right or left side. Then on the div that you want below all your floats, such as a footer, you need to put the clear: both.