垂直对齐对象

Question

我希望始终将这些黄色轮廓框对齐在彼此顶部的垂直线上（见图）。目前我正在使用此代码：

.yellowOutline {
    display:        inline-block;
    width:          30px;
    line-height:    30px;
    border-radius:  25%;
    text-align:     center;
    border:         2px solid #ffcd55;
    position:       relative;
    left:           250px;

正如你所看到的，它正在向右移动黄色方框250 px，这使得它们根据来自＆＃34;今天＆＃34;在右边或＆＃34;昨天＆＃34; （等）和右边。是否有任何代码我可以替换它来实现我想要的东西？

Answer 1

在CSS中有一个vertical-align属性，它控制元素在一行中彼此相邻的方式或彼此排列的方式。

需要沿显示属性设置的基线设置元素 克里斯·科勒（Chris Coyler）有一个很好的编写代码来证明这一点（使用实际代码）

codepen.io/chriscoyier/pen/oJeAK