Maison > Questions et réponses > le corps du texte
P粉2037924682023-08-22 12:35:59
Vous devez ajouter des attributs vertical-align
aux deux divs enfants.
Si.small
始终较短,则只需将该属性应用于.small
.
Cependant, si l’un d’entre eux est le plus élevé, alors cet attribut doit être appliqué à .small
和.big
.
.container{ border: 1px black solid; width: 320px; height: 120px; } .small{ display: inline-block; width: 40%; height: 30%; border: 1px black solid; background: aliceblue; vertical-align: top; } .big { display: inline-block; border: 1px black solid; width: 40%; height: 50%; background: beige; vertical-align: top; }
L'alignement vertical affecte les zones de cellules en ligne ou de tableau, cette propriété a de nombreuses valeurs différentes. Veuillez consulter https://developer.mozilla.org/en-US/docs/Web/CSS/vertical-align pour plus de détails.
P粉8232680062023-08-22 09:52:17
Parce que par défaut, vertical-align
est défini sur baseline.
Utilisez plutôt vertical-align:top
:
.small{ display: inline-block; width: 40%; height: 30%; border: 1px black solid; background: aliceblue; vertical-align:top; /* <---- this */ }
http://jsfiddle.net/Lighty_46/RHM5L/9/
Ou comme @f00644 l'a dit, vous pouvez également appliquer float
aux éléments enfants.