Een HTML-tabel centreren

Op een pagina waar ik momenteel aan werk, lijk ik niet in staat te zijn om een tabel te centreren met een afbeelding in de eerste rij en twee kolommen tekst eronder (de twee kolommen zouden niet meer dan de breedte van de afbeelding)
Hier is de pagina: http://www.puzzles-et-jeux.com /fr/page/minipuzzles.html
Ik heb veel tijd besteed om dit op te lossen.
Ik wil het graag in HTML houden omdat ik me moet haasten en ook omdat ik 20 van dit soort pagina’s moet maken met verschillende breedtes /+ lay-outs voor elke afbeelding.


Antwoord 1, autoriteit 100%

Voor uw ontwerp is het gebruikelijk om divs te gebruiken in plaats van een tabel. Op deze manier wordt uw lay-out beter te onderhouden en te veranderen door een goede styling. Het is even wennen, maar het zal je op de lange termijn een hoop helpen en je zult veel leren over hoe styling werkt. Ik zal u echter een oplossing voor het probleem bieden.

In je stylesheets heb je marges en opvulling ingesteld op 0 pixels. Dit heeft voorrang op uw align="center"-kenmerk. Ik zou aanraden om deze instellingen uit je CSS te halen, omdat je normaal gesproken niet wilt dat al je elementen op deze manier worden beïnvloed. Als je al weet wat er in de CSS gebeurt en je wilt dat zo houden, dan moet je een stijl op je tabel toepassen om de vorige sets te overschrijven. Je kunt de tabel een classgeven of je kunt de stijl inline zetten met de HTML. Dit zijn de twee opties:

  1. Met een klas:

    <table class="centerTable"></table>

In je style.css-bestand zou je zoiets als dit hebben:

.centerTable { margin: 0px auto; }
  1. Inline met uw HTML:

    <table style="margin: 0px auto;"></table>

Als u besluit de marges en opvulling die zijn ingesteld op 0px te wissen, kunt u align="center"voor wat dan ook op uw <td>-tags laten staan kolom die u wilt uitlijnen.


Antwoord 2, autoriteit 41%

table
{ 
margin-left: auto;
margin-right: auto;
}

Dit zal zeker werken.
Proost


Antwoord 3, autoriteit 14%

Probeer dit –

<table align="center" style="margin: 0px auto;"></table>

Antwoord 4

<table align="center"></table>

Dit werkt voor mij.

Other episodes