html - 删除第四个框后，在CSS中将容器居中

我已经删除了第4个框，因为我只需要3个框，并希望第3个框居中。 Here is an image。这是我的CSS代码。下面是HTML代码，一直说代码太多，所以我用更多的文本填充了这一部分，因此希望我能在某些时候获得帮助，希望现在有足够的文本来编写代码？

#featured-wrapper {
  overflow: hidden;
  padding: 5em 0em;
  background: #FFF;
}

#featured h2 {
  text-align: center;
}

#featured .icon {
  position: relative;
  display: block;
  background: #2A70E8;
  margin: 0px auto 20px auto;
  line-height: 2.5em;
  font-size: 4em;
  text-align: center;
  color: #FFF;
}

.column1,
.column2,
.column3,
.column4 {
  width: 282px;
}

.column1,
.column2 {
  float: left;
  margin-right: 24px;
}

.column3 {
  float: left;
}

.column4 {
  float: right;
}

<div id="featured-wrapper">
  <div id="featured" class="container">
    <div class="major">
      <h2>Maecenas lectus sapien</h2>
      <span class="byline">Cras vitae metus aliquam risus pellentesque pharetra</span>
    </div>
    <div class="column1">
      <span class="icon icon-bar-chart"></span>
      <div class="title">
        <h2>Maecenas lectus sapien</h2>
        <span class="byline">Integer sit amet aliquet pretium</span>
      </div>
    </div>
    <div class="column2">
      <span class="icon icon-qrcode"></span>
      <div class="title">
        <h2>Praesent scelerisque</h2>
        <span class="byline">Integer sit amet aliquet pretium</span>
      </div>
    </div>
    <div class="column3">
      <span class="icon icon-building"></span>
      <div class="title">
        <h2>Fusce ultrices fringilla</h2>
        <span class="byline">Integer sit amet aliquet pretium</span>
      </div>
    </div>

  </div>
</div>

最佳答案

我们需要查看您的HTML才能为您提供正确的答案
但是试试这个
替换此代码

#featured-wrapper {
    overflow: hidden;
    padding: 5em 0em;
    background: #FFF;
}

有了这个

#featured-wrapper {
    width:900px;
    margin:0 auto;
    overflow: hidden;
    padding: 5em 0em;
    background: #FFF;
}

您可以更改此号码900
具有HTML的最佳宽度