0

画面サイズの80%の幅のテーブルがあります。このテーブルには私のメニュー項目が含まれています。メニュー項目はテーブルセルの形式です。私が望むデザインは、各セルの幅がその中のテキストと同じだけであるべきだということです。ただし、最後のセルも必要です。これは空で、テーブルの残りのスペースと同じ幅になります。IE最後にテーブルの幅(残りのスペース)を継承させたい。

ただし、テーブルの幅を大きくすると、テキストにぴったり合うのではなく、すべてのセルが引き伸ばされます。

これを防ぐにはどうすればよいですか?

  1. 最後のセルを除くすべてのセルをテキストに正確に一致させたい。
  2. 最後のセルが残りのスペースをすべて占有するようにします。

ありがとう!

4

2 に答える 2

3

最後のセルを拡張して全幅を占めるようにします。

td:last-child {
    width: 100%;
}

…そして、他のセルのテキストが折りたたまれないようにしたい場合は、次のようにします。

td {
    whitespace: nowrap;
}

ここでのデモ:

http://jsfiddle.net/barney/kz77m/

于 2013-02-28T11:44:21.347 に答える
0

CSS経由で簡単です。displayスタイルをに変更するだけinlineです。

添付のフィドル: http: //jsfiddle.net/CZYSa/

于 2013-02-28T11:41:15.633 に答える