tableau en css

Discussion dans 'Administration d'un site Web' créé par rottman, 3 Mai 2005.

  1. rottman
    rottman WRInaute passionné
    Inscrit:
    6 Janvier 2004
    Messages:
    1 810
    J'aime reçus:
    0
    Bonjour,

    Désolé en XHTML strict/CSS2 j'ai honte, j'suis vraiment trop nul... :cry:

    J'aimerais transformer :

    Code:
    <form...........>
    <table align="center" border="0" cellpadding="0">
     <tr>
       <td width="172">blabla :</td>
       <td width="167"><select>.......</select></td>
     </tr>
     <tr>
       <td>blabla :</td>
       <td><select>.......</select></td>
     </tr>
     <tr>
       <td>blabla :</td>
       <td><select>.......</select></td>
     </tr>
    </table>
     <input type="button"........>
    </form>
    j'arrive même pas à aligner un texte avec le menu déroulant... :cry:
    lorsque je mets le <table> dans un div et que je mets text-align:center; pour ce div, le <table> est centré sous IE mais pas Firefox :cry:

    Je voudrais remplacer ce <table> par des <div> en gardant le même design, mais comment ?!

    :D Merci !
     
  2. aladdin
    aladdin WRInaute passionné
    Inscrit:
    29 Avril 2005
    Messages:
    1 246
    J'aime reçus:
    0
    il faut carrement virrer les <table> <tr> et <td> et les remplacer par des <div class="nomdeclasse">

    pour les mise en fore des <div> au format tabeau il suffit de modifier le display dans les css du div regarde ici http://www.w3schools.com/css/pr_class_display.asp

    tu peut aussi utiliser float:left / float:right pour le positionnement de tes colonnes

    et pour des tutorials sur la mise en page en css sans tableaux google est ton meilleur ami ;)
     
  3. rottman
    rottman WRInaute passionné
    Inscrit:
    6 Janvier 2004
    Messages:
    1 810
    J'aime reçus:
    0
    Merci de ton aide ;)
    J'ai enfin réussi
     
  4. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 130
    J'aime reçus:
    319
  5. jeangab
    jeangab WRInaute discret
    Inscrit:
    25 Février 2004
    Messages:
    166
    J'aime reçus:
    0
    mise en forme sans tableau, oui, mais il ne faut quand meme pas les bannir a tous jamais de nos pages, ils font partie du xhtml., c'est seulement les pages "all table" qui sont a proscrire.
     
  6. spout
    spout WRInaute accro
    Inscrit:
    14 Mai 2003
    Messages:
    9 130
    J'aime reçus:
    319
  7. tigrou
    tigrou WRInaute discret
    Inscrit:
    29 Février 2004
    Messages:
    70
    J'aime reçus:
    0
    non il ne faut pas bannir les tableaux, il faut juste s'en servir pour présenter des données ...



    ... TA-BU-LAI-RE !!
     
  8. jeangab
    jeangab WRInaute discret
    Inscrit:
    25 Février 2004
    Messages:
    166
    J'aime reçus:
    0
    exact, les tableaux servent a presenter des données sous une forme tabulaire, il serait bete de s'en passer, seule la mise en page uniquement via des tableaux imbriqués n'est pas des plus subtile, et a contrario, presenter des données tabulaires via "div" ne l'est pas plus....
     
  9. st-antigone
    st-antigone WRInaute impliqué
    Inscrit:
    18 Décembre 2004
    Messages:
    960
    J'aime reçus:
    0
    une question de débutant,
    pourquoi ?

    pour ma part,
    les pages de liens je les fais en "all table",
    je trouve cela bien pratique pour les modifier et pour les lire ...

    j'ai fais aussi des pages menus sous forme de tableaux, très pratique aussi,

    c'est quoi mon erreur ?
     
  10. jeangab
    jeangab WRInaute discret
    Inscrit:
    25 Février 2004
    Messages:
    166
    J'aime reçus:
    0
    oui, ca fonctionne tres bien, mais c'est une utilisation "detournée" des tableaux, ils ne sont pas prevu a l'origine pour faire de la mise en page, c'est un peu comme si tu mangeait de la soupe avec une fourchette.
    plus d'info sur http://css.alsacreations.com/Faire-une- ... -tableaux/
     
  11. aladdin
    aladdin WRInaute passionné
    Inscrit:
    29 Avril 2005
    Messages:
    1 246
    J'aime reçus:
    0
    l'utilisation des tableaux pour la mise en page n'est pas tres pratique pour avoir un site accessible sur divers types de navigateurs,
    tu me dira qu'internet explorer et firefox font tout les deux 95% de la part des navigateurs utilisés, mais pense un peut au autres utilisateurs ...

    en plus la mise en page avec des <div> est beaucoup plus legère et permet d'avoir differentes mises en page à la volé, elle permet aussi de séparrer les données du format (xhtml pour les données et css pour le format)

    Code:
    <table>
       <tr>
            <td colspan="2">entete</td>
       <tr>
       <tr>
            <td>gauche</td>
            <td>droite</td>
       <tr>   
    </table>
    
    devient :

    Code:
    <div class="header">
       entete
    </div>
    
    <div class="left">
       gauche
    </div>
    
    <div class="right">
       droite
    </div>
    
    en utilisant le css :
    Code:
    div.header
    {
        clear:both;
    }
    div.left
    {
        float:left;
    }
    div.right
    {
        float:right;
    }
    

    tu vois bien qu'avec les div tu as moin de niveaux, et ton code devient beaucoup plus clair et la mise en page plus naturelle
     
  12. chooky
    chooky WRInaute discret
    Inscrit:
    12 Septembre 2004
    Messages:
    104
    J'aime reçus:
    0
    Bonjour et merci pour ce post qui répond carément à ma recherche.

    Le site de mon profil a été totalement réalisé en tableau (tableaux imbriqués) et je vais démarrer la version Anglaise et je souhaiterais donc savoir comment évoluer vers le CSS.

    J'ai lu pas mal de tuto, mais je n'ai guère progressé.

    Est ce que un aimable wrinaute pourrait me dire s'il est possible de représenter exactement mon entête en CSS ?
     
  13. Vincent_prague
    Vincent_prague WRInaute discret
    Inscrit:
    12 Mars 2005
    Messages:
    209
    J'aime reçus:
    0
  14. st-antigone
    st-antigone WRInaute impliqué
    Inscrit:
    18 Décembre 2004
    Messages:
    960
    J'aime reçus:
    0
    merci, je vais regarder si je peux sans problème transposer ce que j'ai déjà fait, de table en div ...
     
Chargement...
Similar Threads - tableau css Forum Date
Affichage dynamique d'un tableau en css Développement d'un site Web ou d'une appli mobile 1 Juin 2017
Changement de design complet, tableau > css, impact? Débuter en référencement 16 Novembre 2012
Filtre widget tableau de bord dans Google Analytics Google Analytics 18 Février 2020
Afficher/cacher données dans un tableau Développement d'un site Web ou d'une appli mobile 9 Mars 2019
Tri tableau array en PHP Développement d'un site Web ou d'une appli mobile 26 Février 2019
créer un site qui regroupe les tableaux de bords personnalisés GA de mes sites web Google Analytics 13 Juin 2018
voir mon tableau de bord personnalisé google analytics dans l'appli mobile Google Analytics 7 Juin 2018
Tronquer un tableau array Développement d'un site Web ou d'une appli mobile 27 Novembre 2017
Tableau html responsive Développement d'un site Web ou d'une appli mobile 6 Novembre 2017
Exécution requête sur bouton sur une ligne tableau Administration d'un site Web 5 Juillet 2017