CSS beschrijving eigenschap table-layout


Handleiding HTML Legenda | Voorbeelden | Tabellen | CSS eigenschappen | Begin


table-layout


CSS 2
IE 5.0
NN 6.0
MOZ 1.0
FF 1.0
OP 4.0
De table-layout eigenschap bepaalt of de browser de tabel op de gebruikelijke manier moet weergeven, of snel in een vaste lay-out zonder dat de minimaal benodigde breedte van alle cellen in de tabel bekend is.

Waarden: auto | fixed | inherit
Beginwaarde: auto
Heeft betrekking op: elementen waarvan de display eigenschap de waarde table of inline-table heeft (in HTML is dat het TABLE element)
Wordt geërfd: nee
Mediagroep(en): visual

De table-layout eigenschap (met de waarde fixed) kan ervoor zorgen dat een grote tabel sneller door de browser wordt weergegeven dan normaal. Het gebruiken van deze mogelijkheid is echter alleen aan te bevelen, als zeker is dat kolommen voldoende breed zijn om de inhoud van de cellen compleet weer te geven.

Voorbeeld:

table-layout: fixed
auto
CSS: 2 IE: 5.0 NN: 6.0 MOZ: 1.0 FF: 1.0 OP: 4.0

De waarde auto geeft aan dat de browser de lay-out van de tabel op de gebruikelijke wijze moet bepalen. In de meeste browsers gebeurt dat als volgt:
  1. Eerst wordt voor elke cel de minimum- en maximumbreedte bepaald:
    • De minimaal voor de celinhoud benodigde breedte is de breedte, die nodig is om de inhoud met overgangen naar een nieuwe regel binnen de cel te plaatsen (bij tekst bepaalt het langste woord dus vaak de minimaal benodigde breedte). Wanneer er een breedte voor de cel is opgegeven en deze groter is dan de minimaal benodigde breedte, dan geldt de opgegeven breedte als minimumbreedte. Wanneer de minimaal benodigde breedte groter is dan de opgegeven breedte, of als de width eigenschap de waarde auto heeft, dan geldt de minimaal benodigde breedte als minimumbreedte.
    • De maximaal voor de celinhoud benodigde breedte is de breedte, die nodig is om de inhoud binnen de cel te plaatsen zonder overgangen naar een nieuwe regel (tenzij daar expliciet om gevraagd wordt, bijvoorbeeld door het BR element). Wanneer er een breedte voor de cel is opgegeven en deze groter is dan de maximaal benodigde breedte, dan geldt de opgegeven breedte als maximumbreedte. Wanneer de maximaal benodigde breedte groter is dan de opgegeven breedte, of als de width eigenschap de waarde auto heeft, dan geldt de maximaal benodigde breedte als maximumbreedte.
  2. Vervolgens wordt voor elke kolom de minimum- en maximumbreedte bepaald:
    • De minimumbreedte voor de kolom is de grootste minimumbreedte van de cellen in die kolom, of indien die groter is, de opgegeven breedte voor de kolom.
    • De maximumbreedte voor de kolom is de grootste maximumbreedte van de cellen in die kolom, of indien die groter is, de opgegeven breedte voor de kolom.
    Voor elke cel die meer dan één kolom overspant worden de minimum- en maximumbreedte van de betreffende kolommen indien nodig zo vergroot, dat de gezamenlijke breedte tenminste even groot is al de minimumbreedte van de cel. Zo mogelijk wordt de vergroting gelijk verdeeld over de kolommen.
  3. Als de width eigenschap voor het element dat de tabel definieert (in HTML: TABLE) een berekende waarde anders dan auto heeft, dan is de breedte van de tabel de grootste van de volgende twee waarden:
    • de berekende waarde van de width eigenschap voor het element dat de tabel definieert;
    • de som van de minimumbreedte van elke kolom vermeerderd met de ruimte die ingenomen wordt door de randen en de ruimte tussen de randen.
    Wanneer de berekende waarde van de width eigenschap de grootste is, dan wordt de extra ruimte verdeeld over de kolommen.
  4. Als de width eigenschap voor het element dat de tabel definieert de (begin)waarde auto heeft, dan gaat de breedte van het bevattend blok (vaak is dat het meest dichtbijgelegen voorouder element op blokniveau, waarin het element is opgenomen) een rol spelen:
    • Als de breedte van het bevattend blok groter is dan de som van de maximumbreedte van elke kolom plus de randen en de ruimte tussen de randen, dan bepaalt de tweede de breedte van de tabel. De inhoud past dan in de cellen zonder overgangen naar een nieuwe regel (tenzij daar expliciet om gevraagd wordt).
    • Als de breedte van het bevattend blok groter is dan de som van de minimumbreedte van elke kolom plus de randen en de ruimte tussen de randen, dan bepaalt de eerste de breedte van de tabel. De kolommen worden in dat geval zoveel boven de minimumbreedte vergroot, dat de tabel precies in het bevattend blok past.
    • Als de breedte van het bevattend blok kleiner is dan de som van de minimumbreedte van elke kolom plus de randen en de ruimte tussen de randen, dan bepaalt de tweede de breedte van de tabel. De breedte van het bevattend blok wordt daarbij zoveel als nodig is vergroot.
fixed
CSS: 2 IE: 5.0 NN: 6.0 MOZ: 1.0 FF: 1.0 OP: 4.0

De waarde fixed geeft aan dat de browser de lay-out van de tabel snel en aan de hand beperkte informatie moet bepalen. De browser wacht niet totdat de minimale breedte van elke kolom is berekend op basis van de inhoud van alle cellen in die kolom, maar laat de lay-out alleen afhangen van de opgegeven breedte van de tabel, de opgegeven breedte van de kolommen en de ruimte die ingenomen wordt door de randen en de ruimte tussen de randen. Daarbij gelden ten aanzien van de breedte van de kolommen de volgende regels:
  1. Als voor een kolom (via de elementen COL of COLGROUP) de width eigenschap is gebruikt met een andere waarde dan auto, dan bepaalt deze de breedte van de kolom.
  2. Wanneer er geen width eigenschap is die betrekking heeft op een kolom, dan wordt gekeken of er voor de cel op de eerste rij in die kolom een width eigenschap geldt met een andere waarde dan auto. Als dat zo is, dan bepaalt die de breedte van de kolom. Wanneer de cel meerdere kolommen overspant, dan wordt de breedte verdeeld over die kolommen.
  3. Wanneer voor alle kolommen op basis van de eerste twee punten een breedte is bepaald, dan wordt de som van de breedtes van de kolommen, de randen en de ruimte tussen de randen vergeleken met de breedte die met de width eigenschap is vastgelegd voor de tabel:
    • Als de som van de breedtes van de kolommen plus de randen en de ruimte tussen de randen groter is dan de opgegeven breedte van de tabel, dan bepalen de kolommen de breedte van de tabel.
    • Als de opgegeven breedte van de tabel groter is dan de som van de breedtes van de kolommen plus de randen en de ruimte tussen de randen, dan wordt het verschil verdeeld over de kolommen.
  4. Wanneer er kolommen zijn, waarvoor op basis van de eerste twee punten geen breedte is bepaald, dan wordt onder hen de ruimte die in horizontale richting overblijft (de breedte van de tabel minus de breedte van de overige kolommen, de randen en de ruimte tussen de randen) gelijkelijk verdeeld.
Wanneer er geen breedte is opgegeven voor de tabel en voor de width eigenschap de waarde auto geldt, dan wordt voor de table-layout eigenschap niet de waarde fixed aangehouden, maar de waarde auto.

Wanneer de minimaal voor de inhoud benodigde breedte van een cel groter is dan de breedte van de kolom, dan hangt het van de waarde van de overflow eigenschap af hoe de inhoud wordt weergegeven. Als de eigenschap niet is opgenomen, geldt de beginwaarde visible en moet de browser de inhoud compleet weergegeven. De inhoud zal dan over de rand van de cel doorlopen en de inhoud van de naastgelegen cel overlappen. Sommige browsers houden voor de overflow eigenschap niet de beginwaarde visible aan, maar de waarde hidden. Het deel van de inhoud dat niet in de cel past, wordt dan dus helemaal niet weergegeven. Omdat de weergave in beide gevallen waarschijnlijk niet het gewenste resultaat oplevert, is het verstandig de table-layout eigenschap met de waarde fixed alleen te gebruiken als je zeker weet dat de kolommen voldoende breed zijn om de inhoud van elke cel geheel weer te geven.
inherit
CSS: 2 IE: - NN: 6.0 MOZ: 1.0 FF: 1.0 OP: 7.0

De waarde van het parent element wordt aangehouden.


Bijzonderheden ondersteuning

Microsoft Internet Explorer 5.0 en hoger
- Wanneer de inhoud bij de waarde fixed niet compleet in de cel past, dan wordt voor de overflow eigenschap niet de beginwaarde visible aangehouden, maar de waarde hidden. Het deel van de inhoud dat niet in de cel past, wordt daardoor niet weergegeven.
- De waarde fixed wordt ook aangehouden, als er geen breedte is opgegeven voor de tabel.
Netscape Navigator 6.0
- Een tabel waarvoor de table-layout eigenschap de waarde fixed heeft en die is ingesloten in een andere tabel, wordt niet correct weergegeven.
Opera 4.0/5.0
- Wanneer bij de waarde fixed geen breedte is opgegeven voor meerdere kolommen, dan worden deze niet even breed gemaakt. De beschikbare breedte wordt verdeeld op basis van de inhoud van de cellen op de eerste rij.
- De waarde fixed wordt ook aangehouden, als er geen breedte is opgegeven voor de tabel.
- Bij de waarde fixed wordt wel de breedte van de tabel aangehouden, maar niet die van de cellen. In de verdeling van de beschikbare breedte over de cellen lijkt weinig logica te zitten.
Opera 5.1/6.0
- Wanneer bij de waarde fixed geen breedte is opgegeven voor meerdere kolommen, dan worden deze wel even breed gemaakt, maar alleen als de inhoud in de cellen op de eerste rij past.
- Bij de waarde fixed wordt (naast die van de tabel) ook de opgegeven breedte van de cellen op de eerste rij aangehouden, maar alleen als de inhoud in die cellen past.
Opera 7.0
- De tabel wordt bij de waarde fixed niet correct weergegeven als er geen enkele kolom is, waarvoor een breedte is vastgelegd (de tabel wordt zeer breed en de inhoud is niet zichtbaar).
- Wanneer de inhoud bij de waarde fixed niet compleet in de cel past, dan wordt voor de overflow eigenschap niet de beginwaarde visible aangehouden, maar de waarde hidden. Het deel van de inhoud dat niet in de cel past, wordt daardoor niet weergegeven.
Opera 7.1 en hoger
- Wanneer de inhoud bij de waarde fixed niet compleet in de cel past, dan wordt voor de overflow eigenschap niet de beginwaarde visible aangehouden, maar de waarde hidden. Het deel van de inhoud dat niet in de cel past, wordt daardoor niet weergegeven.



Legenda | Voorbeelden | Tabellen | CSS eigenschappen | Begin

Handleiding HTML (https://www.handleidinghtml.nl/)
Copyright © 1995-2021 Hans de Jong
Laatste wijziging: 5 december 2004