我看到 bootstrap 无法固定行中列的高度。例如:图像1:1,它将在列中响应,但是图像的位置在行的顶部。
如果我在heading
标记中包含文本,则该文本具有默认的边距,可将下面的文本压入。因此,图像将被绑定(bind)到顶部,而文本将在顶部下方。
如果我需要规范化列并使其居中对齐怎么办?
我的问题是:
我到底需要做什么:
抱歉,但是很难在jsfiddle中实现,它包括Angular指令和模板。仅举例来说:
我有一个生成此指令:
我需要将图像居中对齐,或者至少要在
heading
垂直开始处对齐。例如:如果您想尝试,我会制作此jsfiddle。我只接受没有任何代码的解释。
我可以用一些“被黑”的CSS来修复它,但是我想知道如何才能正确地做到这一点。
最佳答案
一种方法是像这样在img
元素上使用translateY:
.v-center {
position: relative;
transform: translateY(50%);
}
您还需要将图像放在
col-*-2
中。演示: http://bootply.com/tVyuhaFoww