对多个 div 标签使用 "inline-block"

Question

我有 2 个 div 元素彼此相邻，它们具有相同的 class。他们的风格是display: inline-block。怎么把它们放在和图片一样的高度：

Answer 1

给 div 一个 vertical-align:top 规则。内联元素的默认垂直对齐方式是 baseline.

Answer 2

我会 float: left them 而不是 display: inline-block

Answer 3

使用垂直对齐将 div 对齐到顶部

.mDiv{
  display:inline-block;
  vertical-align:top;
  width:300px;
  height:200px;
  background-color:red;
  float:left;
}

.mDiv2{
  display:inline-block;
  vertical-align:top;
  width:300px;
  height:50px;
  background-color:blue;
   float:left;
}

<html>
<head>
</head>
<body>
<div class='mDiv'>1</div>
<div class='mDiv2'>2</div>
</body>



</html>

对多个 div 标签使用 "inline-block"

Using "inline-block" for multiple div tags

css

display