[float & clear] Div gaat naar onderkant sidebar

[Verwijderd]

Ik heb een html code met de volgende structuur:

code:

<div id="container">
   <div id="sidebar">
      -- Sidebar
   </div>
   
   <div id="text">
      <div class="box">
          <p><img float />tekst</p>
          <br style="clear: both;" />
      </div>
   </div>
</div>

Probleem is nu echter dat door de clear dat deel van de content wordt uitgerekt tot onderaan de sidebar. Zit nu al eventjes te rotzooien en zoeken maar kom er niet uit. Iemand nog tips? Ik heb zo het flauwe vermoeden dat ik ergens overheen kijk.

[Bosmonster]

Wil je graag helpen, maar heb je iets meer informatie? CSS bijvoorbeeld zou al prettig zijn of liever nog een live voorbeeld.

[Verwijderd]

Live gaat lastig ivm klant-privacy, hier de CSS dan:

code:

#container {
width: 920px;
margin: 0px auto;
}

#sidebar {
width: 200px;
padding: 10px;
float: left;
}

#text {
margin-left: 300px;
padding: 20px 10px;
}

.box {
padding: 15px;
background: url(../images/box-top.gif) no-repeat top;
margin-bottom: 0;
padding-bottom: 1px;
}

[Bosmonster]

Waar gebruik je die clear precies voor? Want het enige dat nu float is die sidebar en dat is dan ook het enige dat gecleared wordt. Dus dat betekent dat ie na de sidebar pas verder gaat.

M.a.w. wat wil je precies WEL bereiken?

[ Voor 11% gewijzigd door Bosmonster op 26-05-2008 15:20 ]

[Verwijderd]

Excuses, slecht uitgelegd. De .box zit een img in die in de tekst loopt. Die moet ik clearen voor het geval de tekst minder hoog is dan de afbeelding.

code:

          <p><img float />tekst</p>
          <br style="clear: both;" />

hierdoor springt de br onder de hoogte van de sidebar.

[Borizz]

Misschien moet je even de CSS specificaties erbij nemen, dan wordt het een stuk duidelijker wat er nu gebeurt en hoe je je probleem op kan lossen: Visual formatting model (hoofdstuk 9.5 Floats).