2016-10-05 9 views
3

私はCSS /ブートストラップと、以下のplnkrの例では任意のテーブル行の高さを低くしたい:CSS Bootstrap AngularJS - テーブル行の高さを減らす方法は?

https://plnkr.co/edit/ftea6vd1qaPZaXGusZAN

私のような多くのアプローチしようとしました:

line-height 
padding 
margin 
height 

をとしてstackoverflowのチェック公式の文書と同様に。誰も働いていない。

テーブルの行の高さを減らすために、何が欠けていますか(画面上のコンテンツをさらに表示するには)?

おかげで、 マーティン

+0

この行をスタイル '.table> tbody> tr> td { パディング:Xpx; } ' –

答えて

3

は、ブートストラップは、このtable-condensedのクラスを捧げている:

<table class="table table-bordered table-hover table-condensed"> 
+0

これは正解です。しかし、さらに凝縮させる必要がある場合は、テーブルセルのパディングを調整する必要があります。ブートストラップには信じられないほど高い[特殊性](https://developer.mozilla.org/en-US/docs/Web/CSS/Specificity)のルールを使用するという(悪い)習慣があるので、それがうまくいかなかったかもしれませんあなたの前に。 – eliland

1

をあなたはより多くのカスタマイズをしたい場合は、ブートストラップのクラステーブル凝縮

それとも

を使用することができますあなたが望む任意の高さでセル内にdivを置くことができます:

<td> 
    <div style="height: 20px; overflow:hidden;"> 
     ... 
    </div> 
</td> 
関連する問題