2016-03-22 17 views
1

tdに幅を追加すると、thが大きくなります。最後の列の幅を制御するにはどうすればよいですか?

最後の列に多くのテキストがありますが、ページ全体に幅を表示したくない場合、どうすれば制御できますか?

私はまだthnowrapとし、 'Replacement'と 'Additional test'は常にyes/no textになります。

私は最後<td>を見つけ、そこに最大幅を適用するhttps://jsfiddle.net/6Lmt5vjc/

table.standardtable { 
    border: 1px solid #ddd; 
    } 
table.standardtable th, 
table.standardtable td { 
    padding: 5px 9px; 
    border-bottom: 1px solid #ddd; 
    border-left: 1px solid #ddd; 
    text-align: left; 
    color: #000; 
    } 
table.standardtable th{ 
    background-color: #f3f3f3; 
    font-weight: bold; 
    } 
table.standardtable th.section1{ 
    background-color: #04659D; 
    color: #fff; 
    border-bottom: 1px solid #044971; 
    } 

答えて

1

使用CSSセレクタを作った:あなたに注意する

table.standardtable tr td:last-child{ /* last-child returns the last instance of the td */ 
    max-width:150px; 
    /* additional styles as required */ 
} 

Fiddle demo

一つのことをフィドル、<td><th>を混ぜて使用しないでください。 <th>はテーブルヘッダーで、<td>は通常のセルです。技術的にはマークアップが機能しますが、それは良い方法ではありません。あなたはマークアップを変更したい場合は、

<table> 
<tr> 
<th></th> 
<th></th> 
<th></th> 
</tr> 
<tr> 
<td></td> 
<td></td> 
<td></td> 
</tr> 
</table> 

代わりcss classesを使用します。

有効なテーブルのようなものだろう。

関連する問題