如何使INPUT元素填满整个表格TD手机

Question

有了这个示例表：

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

     <input value = "this is the text"> 

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

我有<input>元素填充表格的单元格<td>。默认情况下（<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 */ 
}