页头宽度为100％没有工作

.page-header{ 
    background: #393e4f; 
    width: 100%; 
    height:50px; 
    margin: 0 auto; 
}

HTML

<div class="container"> 
    <div class="page-header"><span>XYZ</span></div> 
    </div>

我想要的页面我page-header是100％的宽度。

我得到这样的结果，我不想要的。

谢谢。

编辑我的代码试试下面我的代码 –

据bootstap的默认填充去除填充 –

bootstrap container类增加了一个边距。如果要使用标题全宽，请将其放在容器外。

容器宽度在本节的引导CSS中给出。

2016-08-02 08:19:17

着”我操纵'container'类？ –

当然可以。但如果要在其他页面中使用容器类，则会变得杂乱无章。 –

好的..谢谢。我会把它放在外面。 –

-1

将任何固定宽度的网格布局转换为全宽布局，方法是将最外部的容器更改为.container-fluid。

<div class="container-fluid"> 
    <div class="row"> 
    ... 
    </div> 
</div>

2016-08-02 08:22:29

@Leothelion现在我编辑了我的上面的代码，这将删除填充 –

开始时的主体元素具有默认边距。这就是为什么你有这个空白空间。在大多数主流浏览器中，所有边的默认边距都是8px。它由您的浏览器提供的用户代理样式表以像素为单位定义。只需将此代码插入到您的代码中即可。

body 
    { 
    width:100%; 
    margin:0; 
    }

2016-08-02 08:28:04

我认为你错了。问题是Body“container”的默认值是8px。他把所有的孩子元素都推到了里面。如果我错了，请纠正我。 –

如果只删除.container类，问题仍然存在。 –

回答