容器不适合所有屏幕尺寸的宽度 - Bootstrap答案

【问题标题】：Container doesn't fit width of all the screen size - Bootstrap容器不适合所有屏幕尺寸的宽度 - Bootstrap
【发布时间】：2018-09-21 15:22:16
【问题描述】：

我正在尝试使用bootstrap 设计一个始终适合屏幕尺寸（高度和宽度）的容器。但正如您在示例中看到的那样，它非常适合高度，但不适合所有屏幕尺寸的宽度。

我在这里缺少什么？提前感谢您的建议。

这是代码：

html,body{height:100%;}

.fill{
    width:100%;
    height:100%;
    min-height:100%;
    background-color:#990000;
    color:#efefef;
}

<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container fill">
  <div class="container">This is the title</div>
  <div class="container">
    <div class="row">
      <div class="col-6">Item 1</div>
      <div class="col-6">Item 2</div>
    </div>
    <div class="row">
      <div class="col-6">Item 3</div>
      <div class="col-6">Item 4</div>
    </div>
  </div>
  <div class="container">Author: Mr. X</div>
</div>

【问题讨论】：

标签： css twitter-bootstrap

【解决方案1】：

Bootstrap 将max-width 属性应用于.container。

添加这个 CSS，你应该会很好：

.container {
    max-width: unset;
}

【讨论】：

完美！感谢您的建议。