2016-04-06 9 views
1

私は検索ボックスがいっぱい「なし」の列を返すので、もしレコードのいくつかは、なしと表示されることがあり、レコードの多くは、検索ボックステキストの追加/削除時にdivのサイズを変更しないようにするにはどうすればよいですか?

<table> 
    <tr> 
     <td class="col-3">name1</td> 
     <td class="col-3">sName1</td> 
     <td class="col-3">age1</td> 
     </tr> 
     <tr> 
     <td class="col-3">name..</td> 
     <td class="col-3">sName..</td> 
     <td class="col-3">age..</td> 
     </tr> 
     <tr> 
     <td class="col-3">nameN</td> 
     <td class="col-3">sNameN</td> 
     <td class="col-3">ageN</td> 
     </tr> 
</table> 

.col-3{ 
    width:33,33% 
} 

を持つテーブルを持っていますあたかも「witdh:33,33%」のアトリビュートを持っていないかのように、誰にも包まれていません。

コンテンツを持っていなくても、元のサイズに維持する方法は誰でも知っていますか?

ありがとうございます。

答えて

1

はテーブル

table { 
 
    width: 100%; 
 
    table-layout: fixed; 
 
} 
 
.col-3 { 
 
    width: 33, 33%; 
 
    border: 1px solid grey; 
 
}
<table> 
 
    <tr> 
 
    <td class="col-3">name1 askdlhaslkdhsaldsad asjd;kadaj as;dj;asjd as ;asjsd;asjd;ja</td> 
 
    <td class="col-3">sName1</td> 
 
    <td class="col-3">age1</td> 
 
    </tr> 
 
    <tr> 
 
    <td class="col-3">name..</td> 
 
    <td class="col-3">sName..</td> 
 
    <td class="col-3">age..</td> 
 
    </tr> 
 
    <tr> 
 
    <td class="col-3">nameN</td> 
 
    <td class="col-3">sNameN</td> 
 
    <td class="col-3">ageN</td> 
 
    </tr> 
 
</table>

ための固定幅と一緒に table-layout: fixedをお試しください
-1

は、このいずれかを試してみてください。

<table style="border:1px solid"> 
    <tr> 
     <td style="min-width:50px">one</td> 
     <td style="min-width:100px">two</td> 
    </tr> 
</table> 
関連する問題