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 :

Problème pour centrer verticalement dans un tableau


Sujet :

HTML

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Inscrit en
    Janvier 2004
    Messages
    533
    Détails du profil
    Informations forums :
    Inscription : Janvier 2004
    Messages : 533
    Par défaut Problème pour centrer verticalement dans un tableau
    Bonjour,

    dans une cellule de tableau, j'aimerais centrer verticalement une puce (format gif), du texte et une autre image.
    J'ai essayé avec "valign" puis "vertical-align" (en CSS) mais rien n'y fait.

    Voici un bout de code :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    <center>
    	<TABLE width='599' border='1' cellspacing='0' cellpadding='0'>
    		<TR>
    			<TD width='100'>&nbsp;</TD>
    			<TD align='left'>
                                    <IMG src='IMAGES/puce.gif'>Mon texte
    				<A href='monlien.doc' type='application/msword'>
    				      <IMG src='IMAGES/icone-doc.gif' border='0' alt='DOC'>
                                    </A>
                            </TD>
                     </TR>
    	</TABLE>
    </center>
    Merci d'avance !
    @+

  2. #2
    Membre expérimenté Avatar de Tdeny
    Profil pro
    Inscrit en
    Juin 2004
    Messages
    287
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Juin 2004
    Messages : 287
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    <TABLE width='599' border='1' cellspacing='0' cellpadding='0'>
    	<TR>
    		<TD width='100' height='200'>&nbsp;</TD>
    		<TD style="text-align:center;vertical-align:middle;"><IMG src='IMAGES/puce.gif'>Mon texte
    			<A href='monlien.doc' type='application/msword'>
    			      <IMG src='IMAGES/icone-doc.gif' border='0' alt='DOC'>                                </A>
                        	</TD>
                     </TR>
    </TABLE>
    Modofié en 200px de haut pour bien voir le centrage en hauteur.

  3. #3
    Membre éclairé
    Inscrit en
    Janvier 2004
    Messages
    533
    Détails du profil
    Informations forums :
    Inscription : Janvier 2004
    Messages : 533
    Par défaut
    L'ensemble texte/images est bien centré, par contre, le texte n'est pas centré verticalement par rapport aux deux images. Comment faire ?

  4. #4
    Membre éclairé
    Inscrit en
    Janvier 2004
    Messages
    533
    Détails du profil
    Informations forums :
    Inscription : Janvier 2004
    Messages : 533
    Par défaut
    J'ai aussi testé en encadrant le texte et images d'un <div valign='center'></div>.... sans effet.

  5. #5
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    si tu veux faire apparaitre des puces, je te conseille d'utiliser des listes à puces...

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    <ul>
        <li><a ...>klbke</a></li>
        <li><a ...>kedsdfiezf</a></li>
    </ul>
    tu pourras insérer la puce grâce à la propriété css
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    li {
      list-style-image: url(puce.png);
    }
    pour centrer tes images, il faut bien utiliser vertical-align.
    mais puisque c'est pour centrer les images, il faut l'appliquer aux images, non pas à toute la cellulle...

    par exemple (CSS)
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
     
    table li img {
      vertical-align: middle;
    }
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  6. #6
    Membre éclairé
    Inscrit en
    Janvier 2004
    Messages
    533
    Détails du profil
    Informations forums :
    Inscription : Janvier 2004
    Messages : 533
    Par défaut
    Super ! Ca marche super bien ! Merci beaucoup.

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

Discussions similaires

  1. Problème pour centrer verticalement le texte dans un menu
    Par Greg12345 dans le forum Mise en page CSS
    Réponses: 5
    Dernier message: 26/05/2010, 19h43
  2. Problème avec les espaces dans un tableau !
    Par remixtech dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 10/07/2006, 19h30
  3. Ecrire verticalement dans un tableau
    Par davinout dans le forum Balisage (X)HTML et validation W3C
    Réponses: 9
    Dernier message: 18/05/2006, 07h22
  4. Problème saut de ligne dans un tableau
    Par talggir dans le forum Général JavaScript
    Réponses: 8
    Dernier message: 23/11/2005, 15h10
  5. [ETAT] problème pour centrer un sous-état
    Par tonio-lille dans le forum IHM
    Réponses: 13
    Dernier message: 11/10/2004, 12h28

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