Question

我已经尝试了两天让这些div项水平居中。我有多个徽标，需要两行。他们似乎不想居中但想要向左漂浮。我无法弄清楚它是做什么的。

<div id="x-content-band-4" class="x-content-band vc partners_section_container" style="background-color: transparent; padding-top: 0px; padding-bottom: 0px;">
  <div class="x-container max width wpb_row">
    <div class="x-column x-sm vc  partner_logos x-1-1" style="">
      <div class="partner_logo1"><img class="alignnone size-full wp-image-62" src="http://leadershipwv.org/wp-content/uploads/2017/02/Argos.jpg" alt="argos logo" width="206" height="86" data-pin-nopin="true"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-57" src="http://leadershipwv.org/wp-content/uploads/2016/03/BBT.png" alt="BB&amp;T logo" width="150" height="60" data-pin-nopin="true"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-58" src="http://leadershipwv.org/wp-content/uploads/2016/03/brickstreet.png" alt="brickstreet logo" width="198" height="84" data-pin-nopin="true"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-59" src="http://leadershipwv.org/wp-content/uploads/2016/03/dominion.png" alt="dominion logo" width="198" height="94"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-62" src="http://leadershipwv.org/wp-content/uploads/2017/02/DOWdiamond.gif" alt="dow logo" width="206" height="86"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-62" src="http://leadershipwv.org/wp-content/uploads/2017/02/EQT.jpg" alt="eqt logo" width="206" height="86"></div>
      <div class="partner_logo1"><img class="alignnone size-full wp-image-62" src="http://leadershipwv.org/wp-content/uploads/2016/03/firstenergy.png" alt="first energy logo" width="206" height="86"></div>
    </div>
  </div>
</div>

{{1}}

如果您想查看直播网站please view it here.

Answer 1

因此，wordpress主题本身显然有点时髦。我找到了它并添加了这段代码并解决了这个问题。

JObject

Answer 2

我不知道为什么你在2017年使用表格单元格，我建议你使用flexbox，它会对你有所帮助。

如果你想把容器放在一个容器中，我会很容易地这样做：

.container {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto; }

  .logos {
  padding: 40px 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center; }

  .logo {
  box-sizing: border-box;
  padding: 15px;
  width: 14%;
  display: flex;
  justify-content: center;
  align-items: center; }

在徽标类中使用flex-wrap会导致当内容达到最大宽度时，它会使用相同的规则和比例自动分解到下一列。

我在徽标中使用box-sizing属性以确保内容永远不会超过14％的宽度，如果是这样，在某些情况下会导致奇怪的显示。

无法在此网站上集中多个Div标签

2 个答案: