155

次のマークアップがあるとします。

<table class="table table-bordered" align="center">

セルの数に関係なく、テーブルは常に 100% 幅です。なぜですか？

4

6 に答える 6

239

ブートストラップ内のすべてのテーブルは、コンテナーに従って伸縮します。これ.span*は、選択したグリッド要素内にテーブルを配置することで簡単に実行できます。このプロパティを削除したい場合は、独自のテーブル クラスを作成し、展開したいテーブルに追加するだけです。

.table-nonfluid {
   width: auto !important;
}

このクラスを独自のスタイルシート内に追加し、次のようにテーブルのコンテナーに追加するだけです。

<table class="table table-nonfluid"> ... </table>

この方法では、変更がブートストラップ スタイルシート自体に影響を与えることはありません (ドキュメント内の別の場所に流動的なテーブルを配置したい場合があります)。

于 2012-05-21T15:52:55.810 に答える
12

私は同じ問題を抱えていました。テーブルを修正してから、td 幅を指定しました。th がある場合は、それらも実行できます。

<style>
table {
table-layout: fixed;
word-wrap: break-word;
}
</style>

<td width="10%" /td>

.table-nonfluid では運がありませんでした。

于 2013-09-30T20:59:40.143 に答える
3

私は追加しようとしましたがstyle="width: auto !important"、私にとってはうまくいきます!

于 2014-06-16T14:15:15.853 に答える