页面的侧面有一个空白区域，无法摆脱它

So on the right side of the Carousel there is a white gap and I tried to get ride of it but could not figure it out. It would help a lot if anyone knows how to fix it. I dont really know whats wrong so I made a Jsfiddle and added the css code below. Thanks for any help.

所以在Carousel的右侧有一个白色的间隙,我试图抓住它,但无法弄明白。如果有人知道如何修复它会有很大帮助。我真的不知道什么是错的所以我做了一个Jsfiddle并在下面添加了css代码。谢谢你的帮助。

Jsfiddle

html,
body {
height: 100%;
width: 100%;
margin: none;
padding: none;
}   


@media(min-width:767px) {
.navbar {
    padding: 20px 0;
    -webkit-transition: background .5s ease-in-out,padding .5s ease-in-      out;
    -moz-transition: background .5s ease-in-out,padding .5s ease-in-out;
    transition: background .5s ease-in-out,padding .5s ease-in-out;
}

.top-nav-collapse {
    padding: 0;
}
}

.carousel,
.item,
.active {
height: 100%;
}

.carousel-inner {
height: 100%;
}

.fill {
margin-right: -50px;
width: 100%;
height: 100%;
background-position: center;
-webkit-background-size: cover;
-moz-background-size: cover;
background-size: cover;
-o-background-size: cover;
}

.intro-section {
height: 100%;
padding-top: 150px;
text-align: center;
background: #fff;
}

4 个解决方案

#1

Just override this code of Bootstrap to 0px:

只需将此Bootstrap代码覆盖为0px:

.row {
    margin-right: -15px;
    margin-left: -15px;
}

So that it looks like this:

所以它看起来像这样:

.row {
    margin-right: 0;
    margin-left: 0;
}

This makes the scrollbar to disappear.

这使滚动条消失。

#2

You need to remove the margin from the .row class

您需要从.row类中删除边距

From this:

.row{
margin-right: -15px;
margin-left: -15px; 
}

To this:

.row{
margin-right: 0px;
margin-left: 0px; 
}

Please see the JSfiddle for the example working

请参阅JSfiddle以获取工作示例

#3

Add this little CSS:

添加这个小CSS:

body{
    overflow-x: hidden;
}

FIDDLE: https://jsfiddle.net/lmgonzalves/zqrpg882/1/

#4

Wrap the row inside a container. Without using a container and directly using a row will make it create white space since it has negative margin. 78th line below:

将行包裹在容器内。不使用容器并直接使用行将使其创建空白区域,因为它具有负边距。第78行:

<div class="intro-section container-fluid">
  <div class="row">

JSfiddle

#1