2010-02-17 4 views
4

Dans le cas de test suivant, le texte alt est centré horizontalement, mais il est collé en haut de la boîte. Comment l'obtenir au milieu?Comment obtenir du texte alt pour supporter vertical-align: middle?

<html> 
    <body> 
    <div style="height: 300px; width: 300px; border: solid black 1px;"> 
     <img src="asdfasdf" alt="foo" style="display: block; text-align: center; vertical-align: middle"/> 
    </div> 
    </body> 
</html> 

Répondre

4

Un avantage des tables est qu'elles permettent un centrage vertical entre les navigateurs. Les DIV ne le font pas. C'est une fois où je mordre la balle et ajouter ces TR et TDs laids.

<table cellspacing="0" style="width:300px;height:300px;border:1px solid black;"> 
    <tr> 
    <td style="vertical-align:middle;text-align:center;"> 
     <img src="asdfasdf" alt="foo" /> 
    </td> 
    </tr> 
</table> 

Il est ce qu'on appelle une table de centrage unicellulaire et laid comme il est, cela fonctionne.

0

Essayez avec display:table-cell au lieu de block.

+0

Non. Cela rompt en fait l'alignement horizontal, aussi. – mike

1

Essayez d'utiliser des espaces au début de l'attribut alt. C'était la seule chose qui semblait fonctionner pour moi sur le chrome.

Questions connexes