css: float

[Koetjeboe]

code:

<div id="rightcontent">
  <span class="poster">nogveeeeelmeuk</span>  meuk meuk meuk meuk
</div>

code:

#rightcontent {
    border: 1px solid #000;
}

#rightcontent .poster {
    float:left;
    width: 100px;
    border-right: 1px dashed #000;
    border-bottom: 1px dashed #000;
}

(css is wat versimpeld, onnodige dingen weggehaald)
Het bovenstaande heb ik en die div heeft een border en die span ook. Het probleem zit het in dat de spanNu staat er soms alleen zoveel info tussen die span dingen dat het onder de inhoud van de div komt en dus zorgt voor dat de box van de span over die van de div gaat. Dit wil ik echter niet, ik wil dat de div oprekt. Waarom ik dan float gebruik? Ik wil graag dat de tekst na de span (meuk meuk meuk meuk) onder de span doorloopt.

Ik snap dat dit nogal vaag is dus ff een piccie ter verduidelijking:

[Verwijderd]

clear: both;

Does the trick
Erg eenvoudig, het zorgt ervoor dat als er links of rechts nog gedeelten van een andere box in dezelfde flow layout zitten, dan moet het element zover naar beneden dat er zowel links als rechts niets meer is.

Kijk trouwens uit met die id's, je gebruikt ze zo te zien namelijk meerdere keren op een pagina. Daar zou je dan class voor moeten gebruiken, en # vervangen door een punt.

[Verwijderd]

Sjezus, echt iedereen is tegenwoordig een forum aan het maken (ja ik ook)

1) geef rightcontent min-height op _{dan werkt het in de volgende versie van MSIE}
2) gebruikt ranzige tables
3) gebruik teveel javascript

Verder kan ik even niets bedenken

edit:

Cheatah, dat wilde ik nou net zeggen

[Koetjeboe]

Verwijderd schreef op 30 oktober 2002 @ 21:41:
clear: both;

Does the trick
Erg eenvoudig, het zorgt ervoor dat als er links of rechts nog gedeelten van een andere box in dezelfde flow layout zitten, dan moet het element zover naar beneden dat er zowel links als rechts niets meer is.

Kijk trouwens uit met die id's, je gebruikt ze zo te zien namelijk meerdere keren op een pagina. Daar zou je dan class voor moeten gebruiken, en # vervangen door een punt.

clear:both zet ze hier netjes onder elkaar, wat ook al leuk is natuurlijk Maar wat ik wil is dat de border van de div opgerekt wordt (de height dus eigenlijk) tot de onderkant van de span.

<sub>edit

Wat wel mooi is dat het nu niet meer over elkaar gaat....yay</sub>

En wat betreft die id's...dankje dat je het verteld Ik heb wel even gezocht op wanneer ik precies wat moest gebruiken maar echt duidelijk zag ik dat nergens staan

Verwijderd schreef op 30 oktober 2002 @ 21:41:
Sjezus, echt iedereen is tegenwoordig een forum aan het maken (ja ik ook)

1) geef rightcontent min-height op _{dan werkt het in de volgende versie van MSIE}
2) gebruikt ranzige tables
3) gebruik teveel javascript

Verder kan ik even niets bedenken

edit:
Cheatah, dat wilde ik nou net zeggen

Forum moet je gewoon een keer maken he En gelukkig is het php niet echt een probleem, dat kan ik wel redelijk

1-> kan ja...alleen dat vind netschaap niet zo leuk (dat is dan ook gelijk de maxheight ofzo, met als gevolg dat de tekst van de div voorbij zijn borders gaat
2-> die probeer ik dus niet te gebruiken, en dan loopt die tekst ook niet meer eronderdoor he
3-> hoe? wat? naaah

[Verwijderd]

Koetjeboe schreef op 30 oktober 2002 @ 21:47:
[...]

1-> kan ja...alleen dat vind netschaap niet zo leuk (dat is dan ook gelijk de maxheight ofzo, met als gevolg dat de tekst van de div voorbij zijn borders gaat
2-> die probeer ik dus niet te gebruiken, en dan loopt die tekst ook niet meer eronderdoor he
3-> hoe? wat? naaah

1)
2)
3) ja idd zou ik ook niet doen, daar gaat het niet soepeler van draaien met 100 posts per page

[Verwijderd]

id's gebruik je echt alleen als een naam op een pagina uniek is. Dat is de reden waarom in XHTML forms, anchors, frames etc. een id kregen in plaats van een naam. In CSS kun je ook gebruik maken van die id's, maar om nog extra mogelijkheden te bieden is er het class attribuut, om aan te geven dat bepaalde elementen tot dezelfde klasse behoren.

Ik zit nog even te kijken waarom die box niet mee rekt, dat zou eigenlijk gewoon moeten. Misschien komt dat doordat die drijvende div niet binnen de andere staat? Bij mij levert de volgende structuur echt geen problemen op:

code:

<div class="post">
  <div class="postheader section">
    Header hier
  </div>
  <div class="userinfo section">
    Naam hier
  </div>
  <div class="postbody section">
    <p>Tekst hier</p>
  </div>
</div>

[Koetjeboe]

Verwijderd schreef op 30 oktober 2002 @ 22:01:
id's gebruik je echt alleen als een naam op een pagina uniek is. Dat is de reden waarom in XHTML forms, anchors, frames etc. een id kregen in plaats van een naam. In CSS kun je ook gebruik maken van die id's, maar om nog extra mogelijkheden te bieden is er het class attribuut, om aan te geven dat bepaalde elementen tot dezelfde klasse behoren.

Ik zit nog even te kijken waarom die box niet mee rekt, dat zou eigenlijk gewoon moeten. Misschien komt dat doordat die drijvende div niet binnen de andere staat? Bij mij levert de volgende structuur echt geen problemen op:

code:

<div class="post">
  <div class="postheader section">
    Header hier
  </div>
  <div class="userinfo section">
    Naam hier
  </div>
  <div class="postbody section">
    <p>Tekst hier</p>
  </div>
</div>

Ow, dan gebruik ik id's toch goed Alleen boven stond het verkeerd. De posts staan in een .post class en alle posts staan in die rightcontent id.

code:

<div class="post">
  <div class="posttitle">
    'nTest - <strong>Posted on: 
  </div>
  <div class="poster">
    user zooi 
  </div>
  <div class="posttext">
    <p>bla</p>
  </div>
</div>

Lijkt me toch wel hetzelfde?
Hier zou dus de div class="post" moeten oprekken met div class="poster"