INPUT要素は、この例のテーブルでは、テーブル全体のTDセル

Question

を埋める作り方：

<table> 
    <tbody> 
    <tr> 
     <td> 

     <input value = "this is the text"> 

     </td> 
    </tr> 
    </tbody> 
</table> 

を、私はテーブルの<td>細胞を移入<input>要素を持っています。デフォルトでは（<input>要素）は、<td>セルで利用可能なすべての領域を占めていません。 <input>要素が常に端から端までスペースを埋める方法を確認するには？

Answer 1

この試してみてください：あなたは<入力タイプ= "テキスト" を使用している場合>

table { 
 
    width: 100%; 
 
    border: 1px solid #ccc; 
 
} 
 

 
table td input { 
 
    // display: block; 
 
    width: 100%; 
 
}

<table> 
 
    <tbody> 
 
    <tr> 
 
     <td> 
 

 
     <input value = "this is the text"> 
 

 
     </td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Answer 2

を：

input[type="text"] { 
    width: 100%; 
    box-sizing: border-box /* Just in case if you have defined 
          left or right padding to the input */ 
}