【问题标题】:Bootstrap responsive text-align not workingBootstrap响应式文本对齐不起作用
【发布时间】:2021-10-04 08:46:22
【问题描述】:

我正在尝试仅在较小的视口尺寸及以下制作一些文本中心。比小宽应该左对齐。出于某种原因,当我继续缩小视口时,文本左对齐。

Fiddle

<div class="row">
    <div id="box" class="col-md-6 offset-md-3 col-sm-12 text-md-left text-sm-center">
        Center me on col-sm, otherwise, left align me
    </div>
</div>

#box{
  width:600px;
  height:200px;
  border:1px solid black;
}

【问题讨论】:

  • 您使用的是哪个引导程序版本?
  • @Amalnandan Bootstrap v5
  • 你已经答对了:)
  • 呼吁重新提出问题。这不是重复的。这是一个专门关于响应式引导类行为的问题,而不是 CSS 文本对齐。

标签: html css twitter-bootstrap


【解决方案1】:

使用 Bootstrap 5,您需要使用 text-sm-start:

  <div class="row">
    <div id="box" class="col-md-6 col-sm-12 offset-md-3 text-center text-sm-start">
      Center me on col-sm, otherwise, left align me
    </div>
  </div>

【讨论】:

  • 啊,我不知道 Bootstrap 5 的变化。非常感谢它有效!
猜你喜欢
  • 2013-09-07
  • 1970-01-01
  • 2014-12-31
  • 2013-06-26
  • 2016-11-07
  • 1970-01-01
  • 2014-07-29
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多