Firefox ignorant padding

J'ai ce code CSS:Firefox ignorant padding

#tweet-container{ 
width: 290px; 
height: 272px; 
border: 1px solid #CCC; 
color: #CCC; 
font-size: 28px; 
text-align: center; 
letter-spacing: -2px; 
min-height: 10px; 
display: table-cell; 
vertical-align: middle; 
padding: 15px; 
}

Mais Firefox ne semble pas reconnaître le rembourrage en haut et en bas. Safari et Chrome le montrent normalement, et même dans Firebug quand j'ajoute padding-top: ça ne marche pas. C'est comme si ce n'est pas une déclaration valide ou quelque chose. Y a-t-il quelque chose qui me manque?

Source

2010-04-29 williamg

L'affichage est: table-cellule; respecter la marge? –

Il semble que ce soit le cas, car le rembourrage gauche et droit fonctionne comme d'habitude. – williamg

Il se peut que le contenu soit à l'origine du problème ... nous avons un lien vers une version en direct (ou utilisez http://pastebin.me/) J'ai essayé votre code seul sur une page dans Firefox et le rembourrage fonctionne bien, donc il est très probable que ce soit un autre code qui cause le problème. –

Humm, c'est un peu intéressant. Vous avez défini la largeur sur 272px, mais elle est affichée en tant que 270px. Vous avez défini la hauteur comme 290px, avec le total de 30px de rembourrage, la hauteur réelle affichée devrait être 320px, mais c'est en réalité 318px. Il y avait un peu de jeu et d'affichage à l'extérieur: table-cellule; semble trier le problème. Bien que le rembourrage ne soit pas réparti équitablement pour certaines réactions, tout apparaît en bas. Mettre le texte dans un tag p, et donner une marge supérieure de 15px a fait le travail bien que je pense.

Source

2010-04-29 08:59:19 Tom

La seule vraie raison pour laquelle j'ai utilisé display: table-cell est pour la possibilité d'aligner verticalement du texte qui a une hauteur inconnue. Pour cette raison, je voudrais essayer de garder cela là, mais il semble que c'est le fauteur de troubles ... pourrait avoir à utiliser une solution javascript. – williamg

Ouais, ma solution était un hack de 5 minutes. Aligner verticalement des choses est toujours une douleur dans le dos cependant. Au moins vous êtes plus proche de le comprendre! – Tom

avez-vous essayé d'ajouter padding:15px!important;?

Source

2010-04-29 03:02:38

Je n'avais pas essayé ça, mais ça ne règle pas le problème ... merci, cependant. – williamg

Répondre

Questions connexes