Question

我在Bootstrap中有一行。在这一行中，我有三列。第一列有一个输入字段。第二列有一些文字。第三列有另一个输入字段。您可以在此Bootply中看到此布局，其中包含以下代码：

>>> for i in datetimes_to_ranges(dates): i
... 
(datetime.datetime(2014, 10, 1, 0, 0), datetime.datetime(2014, 10, 3, 0, 0))
(datetime.datetime(2014, 10, 5, 0, 0), datetime.datetime(2014, 10, 7, 0, 0))
datetime.datetime(2014, 10, 9, 0, 0)
datetime.datetime(2014, 10, 11, 0, 0)
(datetime.datetime(2014, 10, 20, 0, 0), datetime.datetime(2014, 10, 22, 0, 0))

我正在试图弄清楚如何垂直对齐中间列中的“Up To”文本。我想垂直对齐文本与行的底部。我怎么能这样做？

Answer 1

表格行的行高为34px，因此将该元素的行高设置为68px将垂直对齐它。

Answer 2

您可以在row上添加课程并设置display: table;

然后在3个div上添加另一个类，并设置display: table-cell;和float: inherit;以及要垂直对齐的元素的最后一个类并设置vertical-align: middle;

Updated Bootply

Bootstrap 3 - 垂直Algn行内容

2 个答案: