Html 嵌套table 后单元格中 input文本框无法对齐
0
悬赏园豆：20
[已解决问题]
解决于 2013-10-30 17:06
可以看到文本框没有对齐，项目中的代码不太好单独的取出来，于时整了一个小demo
<html> <head></head> <body> <table style="width:300;cellpadding:0;cellspacing:0;"> <tr> <td width="100"> <input type="text" style="width:100%" /> </td> <td width="100"> <input type="text" style="width:100%" /> </td> </tr> <tr> <td width="100"> <input type="text" style="width:100%"/> </td> <td width="100"> <table style="width:100%;cellpadding:0;cellspacing:0;"> <tr> <td width="100%"><input type="text" style="width:100%"/></td> <td><label width="30">label</label></td> </tr> </table> </td> </tr> <tr> <td width="100"> <input type="text" style="width:100%"/> </td> <td width="100"> <input type="text" style="width:100%"/> </td> </tr> </table> </body> </html>
直接复制，然后另存为网页格式就可以查看到效果
最佳答案
0
aehyok说的没错：
1 <table style="width:100%;cellpadding:0;cellspacing:0;"> 2 <style> 3 body,th,td{margin:0;padding:0} 4 table{border-collapse:collapse;border-spacing:0} 5 </style> 6 <tr> 7 <td width="100%"><input type="text" style="width:100%"/></td> 8 <td><label width="30">label</label></td> 9 </tr> 10 </table>
收获园豆：8
其他回答(4)
0
<table style="width:100%;cellpadding:0;cellspacing:0;"> <tr> <td width="100%"><input type="text" style="width:100%"/></td> <td><label width="30">label</label></td> </tr> </table>
这段中把table加上样式border-spacing:0 因为用了table 之后table本身的边框也是要占用位置的，
收获园豆：4
0
<style>
body,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
</style>
body,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
</style>
0
<style>
table{border-collapse:collapse; border-spacing:0; border:0px; display:table;}
td { padding: 7px 5px; border: 1px solid #cef; display: table-cell; vertical-align: inherit; }
</style>
收获园豆：4
0
<table border=0 cellpadding=0 cellspacing=0 style="width:300;"> 这样写就没问题了 你把border=0 cellpadding=0 cellspacing=0属性写在外边 别卸载style里面 我试过了 可以对齐
收获园豆：4
