Publicité
+ Répondre à la discussion
Affichage des résultats 1 à 7 sur 7
  1. #1
    Membre régulier
    Inscrit en
    avril 2005
    Messages
    223
    Détails du profil
    Informations forums :
    Inscription : avril 2005
    Messages : 223
    Points : 81
    Points
    81

    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 :
    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. #2
    Membre éprouvé Avatar de ilood
    Inscrit en
    mars 2005
    Messages
    468
    Détails du profil
    Informations forums :
    Inscription : mars 2005
    Messages : 468
    Points : 429
    Points
    429

    Par défaut

    La prorpriét left: centrer me parait erronée.
    Pour centrer un tableau j'aurai fait :
    Code :
    table { margin : 0 auto }

  3. #3
    Membre régulier
    Inscrit en
    avril 2005
    Messages
    223
    Détails du profil
    Informations forums :
    Inscription : avril 2005
    Messages : 223
    Points : 81
    Points
    81

    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. #4
    Membre éprouvé Avatar de ilood
    Inscrit en
    mars 2005
    Messages
    468
    Détails du profil
    Informations forums :
    Inscription : mars 2005
    Messages : 468
    Points : 429
    Points
    429

    Par défaut

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

  5. #5
    Modérateur
    Avatar de Nesmontou
    Homme Profil pro Benjamin PREVOT
    Architecte de système d'information
    Inscrit en
    septembre 2004
    Messages
    1 613
    Détails du profil
    Informations personnelles :
    Nom : Homme Benjamin PREVOT
    Âge : 32
    Localisation : France, Nord (Nord Pas de Calais)

    Informations professionnelles :
    Activité : Architecte de système d'information
    Secteur : Finance

    Informations forums :
    Inscription : septembre 2004
    Messages : 1 613
    Points : 2 894
    Points
    2 894

    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 :
    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. #6
    Membre régulier
    Inscrit en
    décembre 2005
    Messages
    72
    Détails du profil
    Informations personnelles :
    Âge : 29

    Informations forums :
    Inscription : décembre 2005
    Messages : 72
    Points : 71
    Points
    71

    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. #7
    Membre régulier
    Inscrit en
    avril 2005
    Messages
    223
    Détails du profil
    Informations forums :
    Inscription : avril 2005
    Messages : 223
    Points : 81
    Points
    81

    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.

+ Répondre à la discussion
Cette discussion est résolue.

Liens sociaux

Règles de messages

  • Vous ne pouvez pas créer de nouvelles discussions
  • Vous ne pouvez pas envoyer des réponses
  • Vous ne pouvez pas envoyer des pièces jointes
  • Vous ne pouvez pas modifier vos messages
  •