IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

HTML Discussion :

Gestion de largeur de tableau


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éprouvé
    Homme Profil pro
    Inscrit en
    Juin 2010
    Messages
    1 372
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juin 2010
    Messages : 1 372
    Par défaut Gestion de largeur de tableau
    Bonjour,

    Question probablement stupide...

    Comment gérer la largeur d'une table HTML de telle manière a disposer au centre de 2 colonnes de 325 pixels de largeur fixe chacune et d'une colonne à droite et à gauche qui occuperons les reste de la largeur.
    Autrement dit, un tableau à 100% avec une partie centrale fixe ?

    Possible ?
    Si oui, comment svp ?

    Merci

  2. #2
    Membre Expert
    Avatar de rodolphebrd
    Homme Profil pro
    Indépendant
    Inscrit en
    Novembre 2012
    Messages
    2 336
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Indépendant
    Secteur : Conseil

    Informations forums :
    Inscription : Novembre 2012
    Messages : 2 336
    Par défaut
    Re ,

    avec ce code de base :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    <table>
      <tr>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
      </tr>
    </table>
    on peut créer ce CSS:
    Code css : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    table{
      width:100%;
    }
    td{
      background: salmon;
    }
    td:nth-of-type(3), td:nth-of-type(2){
      width: 365px;
     min-width: 365px;
    }
    http://codepen.io/anon/pen/mxpve

    On peut aussi créer une classe pour les deux cellules.

    Le min-width fixe la largeur des cellules même lorsqu'on réduit la taille de la fenêtre à une valeur < 365X2px.

  3. #3
    Membre éprouvé
    Homme Profil pro
    Inscrit en
    Juin 2010
    Messages
    1 372
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juin 2010
    Messages : 1 372
    Par défaut
    La question va te paraitre idiote mais...

    Dans quel ordre je place les 2 code (html et ccs) ?

  4. #4
    Membre éprouvé
    Homme Profil pro
    Inscrit en
    Juin 2010
    Messages
    1 372
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juin 2010
    Messages : 1 372
    Par défaut J'ai trouvé
    Merci de ton aide, j'ai trouvé comment intégrer le code.

    Merci

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

Discussions similaires

  1. Adapter la largeur du tableau selon la résolution d'écran
    Par maparè dans le forum Servlets/JSP
    Réponses: 5
    Dernier message: 01/09/2011, 17h44
  2. Gestion dynamique d'un tableau
    Par direct dans le forum C
    Réponses: 5
    Dernier message: 24/04/2009, 16h29
  3. largeur colonnes tableau
    Par motrin dans le forum Tableaux - Graphiques - Images - Flottants
    Réponses: 4
    Dernier message: 15/05/2008, 17h45
  4. largeur cellule tableau css
    Par neril dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 21/12/2006, 08h40
  5. Pbm de largeur de tableau
    Par BARBIER dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 31/03/2006, 14h36

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo