自举-白色边框周边面板

Question

因此，我有一个网站，我正在工作，它涉及到它的“主要”内容，在一个引导面板。该面板的理想宽度是670px。所以我要做的是创建一个父级，即width: 670px。这是我的输出：

​

​

最让我烦恼的是右边那大块白色。如何解决这个问题，使它失去理智？

这是我使用的HTML：

<div class="  panel_big">
                <div class="panel_top_orange">
  <i class="fa fa-home"></i>
                    <span>Welkom!</span>
                </div>
                <div class="panel-body">
                    Lorem ipsum
                </div>

                            </div>

我的CSS：

.panel_big {
        overflow: hidden !important; 
            border: 3.5px solid rgba(213, 220, 226, 0.9) !important;
            width:  670px;
    }

那么我如何删除这个空格呢？我已经尝试过通过给面板670像素的宽度来覆盖引导设置，但是空间仍然存在.

谢谢。

Answer 1

把所有东西都放进这个地方

<div class="container">
...
<div>

如果您使用的是引导程序。

Answer 2

您需要使用.panel_big的中心位置使用margin: auto和更好的使用宽度: 100%，最大宽度为670 of，当浏览器的宽度将小于670 of .panel_big将开始适应其宽度与浏览器的宽度。下面是代码：

.panel_big {
  overflow: hidden !important; 
  border: 3.5px solid rgba(213, 220, 226, 0.9) !important;

  /* added code */
  width:  100%;
  max-width: 670px;
  margin: auto;
}