在整个屏幕上拉伸 MVC Web 应用程序答案

【问题标题】：Stretch MVC Web app over whole screen在整个屏幕上拉伸 MVC Web 应用程序
【发布时间】：2018-06-09 17:10:20
【问题描述】：

我正在寻找使 MVC 网络应用程序使用整个屏幕的设置（参见图片中的红线）。我很乐意发布一些代码，但由于它看起来像这样，所以当创建一个新项目时，我会发布一个新 MVC 应用程序的开箱即用代码。

我能在整个项目中找到的唯一body-content实例位于 Site.css 中，如下所示：

body {
    padding-top: 50px;
    padding-bottom: 20px;
}

/* Set padding to keep content from hitting the edges */
.body-content {
    padding-left: 15px;
    padding-right: 15px;
}

/* Override the default bootstrap behavior where horizontal description lists 
   will truncate terms that are too long to fit in the left column 
*/
.dl-horizontal dt {
    white-space: normal;
}

/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
    max-width: 600px;
}

【问题讨论】：

标签： css asp.net-mvc twitter-bootstrap asp.net-mvc-4

【解决方案1】：

从 jumbotron 上方的 div 中删除 container 和 body-content 类。

更新：它不是来自 ASP.NET 模板，而是来自 Bootstrap：

【讨论】：

这个作品找到了，谢谢。但是，我不明白，因为 container 和 body-content 只设置了填充值。我将如何更改这些样式以获得相同的行为？
其中一个也有max-width，也限制了jumbotron的宽度。如果你只希望jumbotron是全角的，你也可以在container&body-content的外面和上面取jumbotron div。这也应该有效。
这让我感到奇怪，因为我在样式表中找不到像 max-width 这样的东西（请参阅更新的问题）。其实我不介意jumbotron，内容对我来说很重要。

【解决方案2】：

使用<div class="container-fluid body-content">Blah</div>

【讨论】：