Float = zweven

Float is na absoluut te positioneren de enige eigenschap van CSS die je toelaat HTML elementen te plaatsen daar waar jij ze graag zou willen hebben. Hoewel je je aan enkele regels moet houden wens je frustratieloos te positioneren.

Wetenswaardigheden.

  1. Je kan elke HTML element floaten.
  2. Deze HTML elementen kunnen zowel inline als block zijn ( <ul> <strong> <img> <table> <span> etc… ).
  3. Elke element dat je float wordt automatisch “block“, ook al is het een inline element.
  4. Dus je hebt de mogelijkheid hoogte - height - en breedte - width - te bepalen.
  5. Je moet in feite hoogte en breedte opgeven.
  6. De meest gemaakte fout bij het floaten is het niet opgeven van hoogte en breedte, alhoewel je sommige browsers je deze fout vergeven zullen de browsers die het goed voorhebben met webstandaarden je straffen. - ik hoef hier geen namen toe te voegen ? -.
  7. Het niet opgeven van width bij een gefloat element zorgt ervoor dat het element ofwel even groot is als zijn respectievelijke inhoud of even groot wordt als zijn parent element ( het omvattende element ).
  8. Elementen die worden voorzien van float worden uit de eigenlijke HTML-structuur gehaald, maar altijd na het voorgaande element.
  9. De bovenkant van het gefloate element valt altijd samen met de bovenkant van het omvattende element.
  10. Tekst zal automatisch rond een gefloat element vloeien.
  11. Gefloate element zullen nooit tekst of afbeeldingen afdekken, absoluut gepositioneerde elementen kunnen/zullen dat wel.
  12. 2 Opeen volgende elementen met float: left; of float: right; zullen langs elkaar komen te liggen, zolang de breedte van de 2 elementen de totale breedte van het omvattende element niet overschrijden.
  13. Een float: left; clear je met clear: left; en natuurlijk omgekeerd van hetzelfde.
  14. float: left; en float: right; gebruikt? Clear dan met clear: both;

Hopelijk heb je er iets aan, en ben ik niets vergeten.