页眉未在WordPress中显示全宽

Question

我在WordPress中使用bootstrap。标题为背景图像。但它并没有显示全宽。我在WordPress之外测试了代码。它以全宽显示页眉，但不是以WordPress格式显示。

​

.header-container {
  display: block;
  position: relative;
  height: 326px;
  width: 100%;
}

.background-image {
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

<div class="container">
  <div class="row">
    <div class="col-xs-12">
      <div class="header-container text-center background-image" style="background-image: url(<?php header_image(); ?>);">
      </div>
    </div>
  </div>
</div>

​

请查看以下链接的屏幕截图以供参考

with WordPress页眉没有显示全宽的背景图像：with WordPress Header！

但是，如果没有WordPress代码就会显示全宽的标题：without WordPress Header！

Answer 1

尝试将.header-container类更改为：

.header-container{
   display: inline-block;
   position: relative;
   height: 326px;
   width: 100%;
}