Bootstrap Jumbotron不会成为身体的全宽 [英] Bootstrap Jumbotron not becoming full width of Body
问题描述
您好，我试图修复我的Jumbotron的屏幕的全宽，但不知何故需要一个 15px padding-left，padding-right 。如果我删除填充，水平滚动条出现一个 30px右边距。我使用默认的Bootstrap版本3.0.3和默认VS2013布局。根据此链接，我删除了Jumbotron以外的所有 .container 我的页面看起来像这样
Hi I am trying to fix my Jumbotron to be full width of the screen but somehow it need a 15px padding-left, padding-right. If I remove the padding the horizontal scrollbar appears with a 30px right margin. I am using the default Bootstrap ver 3.0.3 and default VS2013 layout. As per this link I removed the Jumbotron outside all .container my page looks sth like this
<body>
<div class="navbar navbar-inverse navbar-fixed-top">.... Navigation stuff</div>
<div class="jumbotron specialjum">
<div class="over container body-content">
....page headers and other stuff
</div>
</div>
<p class="just container body-content">
... body text
</p>
</body>
////////////////////// ////////////////////////////
/////////////////////////////////////////////////
body {
padding-top: 50px;
padding-bottom: 20px;
/*background:url("../Images/ps_neutral.png") repeat;*/
}
/* Set padding to keep content from hitting the edges */
.body-content {
padding-left: 15px;
padding-right: 15px;
}
.just {
text-align: justify;
}
.specialjum {
background: url('http://fc00.deviantart.net/fs70/i/2013/339/7/1/princess_kenny_korosu_by_theshadowstone-d6wu2zo.png') center;
color:#fff;
background-size: cover;
}
编辑：
Firefox + Chrome + IE10 results === | ================ | ===
Firefox + Chrome + IE10 results ===|================|===
有关如何修复布局的任何想法？我没有触摸Bootstrap CSS，我更新使用Nuget。
Any Ideas on how to fix the layout? I haven't touch the Bootstrap CSS which I updated using Nuget.
推荐答案
嗨家伙解决方案很简单这是我如何div
Hi guys the solution was simple this is how I div it
<body>
<div class="navbar navbar-inverse navbar-fixed-top">.... Navigation stuff</div>
<div> <===================this Div wrapping jumbotron
<div class="jumbotron specialjum">
<div class="over container body-content">
....page headers and other stuff
</div>
</div>
<p class="just container body-content">
... body text
</p>
</div>
</body>
不更改CSS的任何部分。不知道为什么它的工作，但它只是工程。
No Changes to any part of the CSS. Dont know why it works but it just Works.
这篇关于Bootstrap Jumbotron不会成为身体的全宽的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
