css – Bootstrap 4 – 中心列表

前端之家收集整理的这篇文章主要介绍了css – Bootstrap 4 – 中心列表前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

我正在使用Bootstrap 4 beta构建应用程序.这个应用程序目前非常基本,并且有一个内联列表.我试图将这个列表水平居中在屏幕中间.如此Bootply所示,我认为理由 – 内容中心会这样做.但是,这没有用.我尝试了其他的中心课程,我看到here没有任何运气.我的列表看起来像这样:

如何使用Bootstrap 4 beta集中内联列表?

最佳答案
使用文本中心OR,

在flexBox容器内使用mx-auto(d-flex)..

https://www.bootply.com/6COUMfNrEU

如何在Bootstrap 4中心工作……

text-center用于显示:内联元素

mx-auto(自动x轴边距)将居中显示:块或显示:具有已定义宽度的flex元素(%,vw,px等).默认情况下,在网格列上使用FlexBox,因此还有各种居中方法……

中心文本或内联元素:文本中心

中心显示:阻止或显示:flex:mx-auto

列也可以使用:mx-auto居中,因为行是display:flex

Demo Bootstrap 4 Horizontal Centering

猜你在找的CSS相关文章