[CSS] centrer un tableau

Discussion: [CSS] centrer un tableau

Tags:
  1. Azharis a écrit:

    Par défaut [CSS] centrer un tableau

    Voila, j'éssai de centrer un tableau au milieu de la page avec du code CSS mais je n'y arrive pas.

    J'ai réussi à la centrer avec ce code :

    Code: [Affichage]
    1
    2
    3
    4
    5
    6
    table
    {
    	caption-side : top;
    	position : absolute;
    	left : centrer;
    }
    Le problème c'est que vu qu'il y a quatre tableaux, ils se chevauchent tous.

    Avez-vous la solution ?

    Merci.
  2. Avatar de ilood

    ilood a écrit:

    Par défaut

    La prorpriét left: centrer me parait erronée.
    Pour centrer un tableau j'aurai fait :
    Code: [Affichage]
    table { margin : 0 auto }
  3. Azharis a écrit:

    Par défaut

    En effet, le left : center ne marche pas.

    Mais le auto ne marche pas non plus, le tableau reste sur le côté gauche.
  4. Avatar de ilood

    ilood a écrit:

    Par défaut

    Le margin auto ne fonctionne sous IE que si tu as déclaré un doctype au début du document.
  5. Avatar de Nesmontou

    Nesmontou a écrit:

    Par défaut

    Salut, en fait le margin: 0 auto; marche très bien sous FireFox mais pas sous IE ; pour remédier à cela, il faut mettre text-align: center; pour l'élément qui contient le tableau

    Voici un petit exemple :
    Code: [Affichage]
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    <html>
    <head>
    	<style type="text/css">
    	body {text-align: center;} /* Pour centrer dans IE */
    	table {background-color: #f00; margin: 0 auto;} /* Pour centrer dans FF */
    	</style>
    </head>
    <body>
    <table>
    	<tr>
    		<td>test</td>
    		<td>test</td>
    		<td>test</td>
    	</tr>
    	<tr>
    		<td>test</td>
    		<td>test</td>
    		<td>test</td>
    	</tr>
    </table>
    </body>
    Bon développement ;-)
    Si vous ne pouvez expliquer un concept à un enfant de six ans, c'est que vous ne le comprenez pas complètement. Albert EINSTEIN

    F.A.Q. : Java, PHP, (X)HTML / CSS

    N'oubliez pas de cliquer sur le bouton Résolu en bas de page quand vous avez obtenu une solution à votre problème
  6. djnos a écrit:

    Par défaut

    Salut, alors moi perso j'aurais pas mis la position en absolute pour centrer le tableau. Si tu fais ça il pourra pas centrer et mettra par défaut le tableau collée au bloc parent à 0px en partant du haut et 0px en partant de la gauche.

    fais plutôt

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

    exemple (il faut mettre le doctype) :


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title></title>
    <style type="text/css">
    table
    {
    margin-left:auto;
    margin-right:auto;
    border: 1px solid blue;
    }

    </style>
    </head>
    <body>
    <table>
    <tr><td>Hello</td><td>World</td></tr>
    </table>

    </body>
    </html>
  7. Azharis a écrit:

    Par défaut

    C'est bon, j'ai fait un div avec une classe qui a la propriété text-align : center, et ca marche très bien comme ca.


    Merci de votre aide.