CSS -在同一条垂直线上对齐3个边。

Question

我是CSS的新手，我试图在同一条线上垂直对齐3个块(3个标记)。

下面是代码：

https://jsfiddle.net/valiciousssx/1qg2nr7y/1/

所以，我有这三个边，当我调整浏览器的宽度时，我很难在同一条线上对齐它们。我的意思是，有些点都在同一条线上，但通常不在另一条线下。

我试着使用display: inline-block，但一无所获。

如何解决这个问题？

Answer 1

我是通过用<br><br>替换<br style="clear: both">来实现它的。叶可以在这里读到：https://developer.mozilla.org/en-US/docs/Web/CSS/clear

我尝试了MDN的伪元素解决方案，它也起作用了(在本例中，您根本不需要<br>s )：

article::after {
  content: '';
  display: block;
  clear: both;
}