面板宽度与我的表格匹配

Question

如何让我的面板宽度足够大以容纳我的桌子？

Plunker：http://embed.plnkr.co/o0PDPAeo2lnLKNU55Ber/preview

表格列的数量是动态的，因此我无法将其设置为固定宽度。

<div class="container">
<div class="table-responsive standings">
  <div class="panel panel-primary">
    <div class="table-responsive standings">
      <table class="table table-striped table-condensed entry-grid">
        <thead>
          <tr>
            <th>Name</th>
            <th class="text-center">Strikes</th>
            <th class="text-center pick-title">1</th>
           ...
            <th class="text-center pick-title">12</th>
          </tr>
        </thead>
        <tbody>
          <tr>
            <td>Entry 1</td>
            <td class="text-center">1</td>
            ...
            <td class="text-center pick">A</td>
          </tr>
        </tbody>
      </table>
    </div>
  </div>
</div>

.container {
width: 750px;
padding: 20px;
}

.standings > table {
  width: auto;
}

.standings .pick-title {
  width: 42px;
}

.standings .pick {
  height: 41px;
  width: 41px;
  padding: 8px 0;
  font-size: 10px;
}

由于

Answer 1

您需要为面板DIV显示内联块。这样，面板将调整到其内容宽度

.panel{
    display: inline-block;
}