Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
2281 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  vertical-align : je n'arrive pas à faire ce que je veux avec.

 
 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

vertical-align : je n'arrive pas à faire ce que je veux avec.

n°1168791
zapan666
Tout est relatif
Posté le 03-08-2005 à 12:36:45  profilanswer
 

Bijour !
 
Alors, aujourd'hui, j'ai un petit problème.
 
J'ai une structure HTML qui ressemble à ceci :
 

Code :
  1. <span><img src="" alt=""/> mon texte bidon</span>


 
et grosso modo le css ressemble à ceci  

Code :
  1. span { display: block; height: 22px; }


 
Pour l'instant, l'image et le texte se colle en haut du span (il est en display: block), laissant ainsi un trou entre le texte et le bas du span, mais je voudrais que l'image et le texte s'aligne au milieu, en hauteur du span.
 
J'ai donc voulu utilisé la propriété vertical-align: middle, mais étrangement, ça ne marche pas.
Je pensais que ça venais du navigateur (IE 5.5), mais non, ça ne vient pas de là.
 
Je me trompe de propriété ? Pour l'instant, je peux utilisé des margins-top, ou padding-top, mais ça fait plus cache misère qu'autre chose.
 
 
Merci  :bounce:


Message édité par zapan666 le 03-08-2005 à 12:37:40

---------------
my flick r - Just Tab it !
mood
Publicité
Posté le 03-08-2005 à 12:36:45  profilanswer
 

n°1168797
afbilou
pouet your life
Posté le 03-08-2005 à 12:42:33  profilanswer
 

vertical-align sert a aligner des elements inline les uns par rapport aux autres ou a aligner verticalement le contenu d'un element de types table-cell et derivés.
 
Tu vas devoir jouer sur des marges negatives et le placement relatif !
 
position: relative;
top: 50%;
margin-top: -1em;
 
par exemple...

n°1168803
masklinn
í dag viðrar vel til loftárása
Posté le 03-08-2005 à 12:52:26  profilanswer
 

afbilou a écrit :

vertical-align sert a aligner des elements inline les uns par rapport aux autres ou a aligner verticalement le contenu d'un element de types table-cell et derivés.
 
Tu vas devoir jouer sur des marges negatives et le placement relatif !
 
position: relative;
top: 50%;
margin-top: -1em;
 
par exemple...


Pour être plus précis, vertical-align aligne le texte sur ses lignes, l'unique exception étant les cellules de tables :o


---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box by throwing away the limits imposed by overbearing genetic regulations? Isn't that a good thing?
n°1168974
zapan666
Tout est relatif
Posté le 03-08-2005 à 15:11:40  profilanswer
 

afbilou a écrit :

vertical-align sert a aligner des elements inline les uns par rapport aux autres ou a aligner verticalement le contenu d'un element de types table-cell et derivés.
 
Tu vas devoir jouer sur des marges negatives et le placement relatif !
 
position: relative;
top: 50%;
margin-top: -1em;
 
par exemple...


bah en fait, non, ça va pas ça (le relative + top) car pour cela, il faudrait que mon texte soit  encore dans un conteneur, et c'est pas le cas...Il sert a quoi le margin-top en négatif ?  
 

masklinn a écrit :

Pour être plus précis, vertical-align aligne le texte sur ses lignes, l'unique exception étant les cellules de tables :o


bah justement, en parlant de table...
 
En fait, tout ce bordel, c'est pour un tableau (oui, ce sont de données tabulaires...)
En fait, j'ai une entête de tableau sur chaque ligne, contenant le nom du personne. Le nom de cette personne est dans le span, ce span prend une certaine place dans la cellule selon certain caractéristiques de la personne (bref, ça fait comme un diagramme en baton horizontal)
 

Citation :


+----+-----------------+
|      | Blabla            |
+----+----+------------+
|            | Blabla2     |
+---------+------------+
  |              |
  |              +----> <span>
  +----> <th>


 

Code :
  1. <tr><th><span class="niveau0">Balabla</span></th>....</tr>
  2. <tr><th><span class="niveau1">Balabla</span></th>....</tr>


Pour faire le décalage, je fais juste un nmargin-left sur le span (via les niveau0, niveau1, etc), mais niveau hauteur, c'est "assez" haut, du coup le texte colle en haut (et moi, j'veux qu'il soit au milieu)
 
Je peux peut être m'en sortir en applicant les rêgles CSS des tableaux sur mon span ?


Message édité par zapan666 le 03-08-2005 à 15:12:39

---------------
my flick r - Just Tab it !
n°1168982
gatsusat
Posté le 03-08-2005 à 15:14:24  profilanswer
 

pourkoi tu as des span dans tes TH ? tu peux pas style les TH directement ?

n°1168989
zapan666
Tout est relatif
Posté le 03-08-2005 à 15:18:54  profilanswer
 

gatsusat a écrit :

pourkoi tu as des span dans tes TH ? tu peux pas style les TH directement ?


bah je fais comment mon effet de décalage sans aussi ? (ouais, parce que je mets une bordure sur mes <span>, ainsi qu'une couleur de fond)
 
(sinon, oui, un padding-right aurait suffit :P)


---------------
my flick r - Just Tab it !
n°1169080
masklinn
í dag viðrar vel til loftárása
Posté le 03-08-2005 à 16:43:25  profilanswer
 

zapan666 a écrit :

bah je fais comment mon effet de décalage sans aussi ?


[:petrus75]


---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box by throwing away the limits imposed by overbearing genetic regulations? Isn't that a good thing?
n°1169089
zapan666
Tout est relatif
Posté le 03-08-2005 à 16:47:31  profilanswer
 

masklinn a écrit :

[:petrus75]


Je ne sais faire qu'avec un span, ou avec une image invisible, au choix [:petrus75]
 
- c'est pour un intranet, hein -
- ste vieille excuse bidon -
 
en fait, ça ressemble plutôt à ça :  
 

Citation :


+     +-----------------+
       | Blabla            |
+     +----+------------+
              | Blabla2    |
+           +------------+
  |              |
  |              +----> <span> avec bordure
  +----> <th> sans bordure


Message édité par zapan666 le 03-08-2005 à 16:50:16

---------------
my flick r - Just Tab it !
n°1169174
masklinn
í dag viðrar vel til loftárása
Posté le 03-08-2005 à 17:46:02  profilanswer
 

J'ai un peu du mal à conceptualiser stu veux [:petrus75]
 
th, c'est un header, un titre, c'est quoi ces machins "blabla" là [:petrus dei]


---------------
I mean, true, a cancer will probably destroy its host organism. But what about the cells whose mutations allow them to think outside the box by throwing away the limits imposed by overbearing genetic regulations? Isn't that a good thing?

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  vertical-align : je n'arrive pas à faire ce que je veux avec.

 

Sujets relatifs
au secours, je veux plus de frameset !!!J'arrive pas à référencer mon site
je veux un creer chant "table"! et j'ai une erreur lors de la requetteje n'arrive pas à supprimer les doublons dans ma combobox
N'arrive pas à faire un calcul en c++Menu vertical déroulant hs sous firefox
easy php j arrive pas a demarrer mon server sql[PHP] je n'arrive pas à faire fonctionner Apache
[PHP] verification email, je veux le même !Menu vertical.
Plus de sujets relatifs à : vertical-align : je n'arrive pas à faire ce que je veux avec.

Forum MesDiscussions.Net, Version 2010.2
(c) 2000-2011 Doctissimo
Page générée en 0.064 secondes

Copyright © 1997-2025 Groupe LDLC (Signaler un contenu illicite / Données personnelles)