Question

我有以下标记：

<div class="row">
    <div class="col">
    </div>
    <div class="col-auto">
        <h1 class='headline'>Pardon Our Dust! We Are Building Something Great!</h1>
    </div>
    <div class="col">
    </div>
</div>

使用bootstrap和以下CSS设置样式：

h1, h2, h3, h4, h5, h6, p, a {
font-family: 'Raleway', 'Droid Sans';
color: black;
line-height: 120%;
}
.headline {
text-align: center;
font-weight: bold;
}

当屏幕宽度低于990px时，它应该在多行上打印，而是弹出滚动条。如果行的高度没有扩大，我觉得它无法使用流体容器。关于如何解决这个问题的任何建议？

以下是我得到的内容：http://www.beehivefinancial.com/fap/

Answer 1

我想问题出现在HTML中，尝试应用类.internal.而不是emply列，即：

org.scalaide.

而不是：

.col-md-offset-X

Answer 2

所以这是我提出的解决方案。所以我看了一下bootstrap类，看起来宽度设置为width:auto; max-width:none;。所以我采用了col-auto提供的最佳效果，插入了我的页面最大值990px，并在我自己的样式表中创建了以下类：

.auto-col {
position: relative;
min-height: 1px;
padding: 0px 15px;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
width: 100%;
max-width: 990px;
}

它是一个庞大的解决方案，但它解决了我的问题。

如何将文本包含在bootstrap col中

2 个答案: