margin-top sur firefox et chrome
J'ai un côté de la barre de navigation sur mon site. Le volet diapositives avec vous et les changements margin-top.
Sur google chrome, il vous suit, alors que dans firefox, il fait toutes les boîtes de vous suivre, qui ne les laissez pas vous défiler en bas de la page.
http://jsfiddle.net/rDV3T/ C'est un exemple.
<span class="hi">HI</span>
<span class="hello">Hello</span>
CSS
.hi {
margin-top: 10px;
background-color: red;
display: inline-table;
}
.hello {
display: inline-table;
}
Si vous tester sur firefox, toutes les boîtes descend de 10 px, alors que dans google chrome, seule la zone affectée (hi) descend.
Comment pourrais-je résoudre ce problème?
Merci et désolé pour mon mauvais anglais et de l'explication.
OriginalL'auteur Lohn Claidon | 2013-12-01
Vous devez vous connecter pour publier un commentaire.
Si vous ajoutez
vertical-align: top;
à votrehello
de la classe de l'exemple air d'être le même sur tous les navigateurs.OriginalL'auteur Berry Blue
Vous devriez utiliser la propriété CSS float propriété. Au lieu de
display:inline-table
, utilisezfloat:left
de faire toutes les boîtes de flotter à gauche. (Vous aurez également besoin d'un<div>
avec la propriétéclear:both
après vos deux travées.)OriginalL'auteur Hardmath123
Vous pouvez résoudre votre problème avec
display: inline-block
ou de mettre en.hello
vertical-align: bottom;
DÉMONSTRATION EN DIRECT
êtes-vous sûr? vous voyez ici le DÉMO avec
vertical-align: top;
... cependant, si vous avez dit que latop
travaillé pour vous... ok! 🙂OriginalL'auteur Black Sheep