Question

我有两个按钮，一个具有单行文本，另一个具有两个行文本。这些按钮不是内联的。我如何使其内联？

我尝试使用不同的CSS样式对其进行修复。

与此类似：

button{
  height:50px;
}

<button>Single Line</button>
<button>Multiline<br>Line</button>

Answer 1

左键.btnVideo写在top: 8px;注释中，/* top: 8px */未被执行。如果使用的是Google chrome，则可以使用inspect元素轻松检查。

Answer 2

尝试vertical-align:middle;

button{
  height:50px;
  vertical-align:middle;
}

 <div class="mainContainer">
        <button class="actionBtn btnVideo">Take a Video</button>
        <button class="actionBtn btnEvent">Attend Event<br><span>(Check-In/Check-Out)</span></button>
    </div>

button{
  height:50px;
  vertical-align:middle;
}

<button>Single Line</button>
<button>Multiline<br>Line</button>

如何使按钮内联？

2 个答案: