[解決済み] Twitter Bootstrapのテーブルの幅が常に100%なのはなぜですか?
2022-04-27 08:18:04
質問
このようなマークアップがあるとします。
<table class="table table-bordered" align="center">
セルがいくつあっても、テーブルの幅は常に100%です。なぜでしょう?
どうすればいいですか?
ブートストラップ内のすべてのテーブルは、そのコンテナに応じて伸縮します。
.span*
グリッド要素から選択します。このプロパティを削除したい場合は、独自のテーブル・クラスを作成し、それをコンテンツと共に展開したいテーブルに追加するだけです。
.table-nonfluid {
width: auto !important;
}
このクラスを自分のスタイルシートの中に追加し、テーブルのコンテナにこのように追加するだけでいいのです。
<table class="table table-nonfluid"> ... </table>
この方法では、変更はブートストラップ・スタイルシート自体に影響を与えません (ドキュメント内の別の場所に流体テーブルを持ちたい場合があります)。
関連
-
[解決済み] Twitter Bootstrapのメニューをクリックではなく、ホバーでドロップダウンさせる方法
-
[解決済み] Twitter Bootstrap 3を使用して列を中央に配置する
-
[解決済み] Twitter Bootstrapでナビバーの色を変更する
-
[解決済み] Twitter Bootstrap Form File Element Upload Button(ファイルアップロードボタン
-
[解決済み] Twitter Bootstrapのモーダルクローズに関数をバインドする
-
[解決済み] Twitter Bootstrapを使った中央寄せのコンテンツはどうなっているのか?
-
[解決済み] Twitter Bootstrapのモーダルウィンドウを閉じないようにする
-
[解決済み] Twitter Bootstrap - 行と行の間に上部のスペースを追加する
-
[解決済み] Bootstrapでコンテナを垂直方向に中央化する方法は?
-
[解決済み] 100% width Twitter Bootstrap 3 テンプレート
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] Bootstrap 4のColでコンテンツを下に揃える方法
-
[解決済み] SCSSファイルエラー。インポートするファイルが見つからないか読めません: bootstrap
-
[解決済み] BootstrapでNavbarが折りたたまれない
-
[解決済み] <td>に固定幅を設定するには?
-
[解決済み】Bootstrap 3 ナンバーバーの折りたたみについて
-
[解決済み】Twitter Bootstrapのポップオーバーを外側のクリックで解除する方法は?
-
[解決済み] Twitter Bootstrapを使用して垂直方向の空白を追加しますか?
-
[解決済み] Bootstrap 4: ドロップダウンメニューが画面の右側にずれていく
-
[解決済み] Bootstrap: コンテナの幅を変更するには?
-
[解決済み] Twitter Bootstrapのモーダルでエスケープキーを使って閉じる機能を有効にするにはどうしたらいいですか?