css – Bootstrap垂直对齐图像

前端之家收集整理的这篇文章主要介绍了css – Bootstrap垂直对齐图像前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
在这个网站上: http://www.livenews.surf/我想让新闻图片文字垂直对齐,我怎么能这样做?

解决方法

最简单的解决方案是使用FlexBox(有关其用法的详细信息,请参阅规范).

对于这种特殊情况,请为包含div的每个内容(当前只有.col-md-11)分配一个自定义类,例如类“content”,并将此代码添加到样式表中

.content {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

代码说明:align-items垂直对齐项目,因为我们离开了默认的flex方向,即row和flex-wrap将允许我们的父容器将子项包装到下一行(默认为nowrap).

请记住,我没有为此答案添加供应商前缀,但我强烈建议您使用Autoprefixer等工具.

猜你在找的CSS相关文章