我有一个< textarea>需要适应尺寸未预先确定的空间(占屏幕尺寸的百分比).如果FireFox通过设置常规CSS属性,我可以获得良好的结果：
#container { width: 70%; height:70% }
#text_area { width: 100%; height: 100%; margin: 0; padding:0; }
然而在IE 6和7中,我得到了不同的奇怪结果.在IE6中,文本框似乎在左侧和右侧都有填充,从而推动容器的大小增长.在IE7中,文本框左侧有填充,但不会使容器的大小增大 – 而是将其右边缘推到容器外部.
高度设置似乎对IE6或IE7没有影响; < textarea>在两种情况下都是2行长,忽略高度：100％指令.
是否有一致的方法来确定< textarea>的大小？跨浏览器？
有没有办法摆脱< textarea>？左边的填充？
更新
使用position：absolute删除填充,但宽度：100％仍然被搞砸了. IE7似乎计算出100％宽度太大,导致< textarea>溢出< div>包含它.
如果我有机会,我会创建一个独立的例子……
解决方法
我在IE7中也看到了ASP.Net文本框控件的这个问题.我不记得我找到了解决方案的位置(但找到了解决方案的人的道具),但是我遇到了同样的问题,其中width =“100％”的文本框实际上会破坏DOM而我的整个内容部分将“溢出到相邻部分(例如基于表格的导航).
我最终采用的解决方案是将asp：TextBox包装在自己的表中并设置“table-layout：fixed; width：100％”属性,并在textBox / textarea“position：relative; width：100％;”所以块看起来像这样：
<table style="width: 100%; table-layout: fixed;">
<tbody>
<tr>
<td>
<asp:TextBox id="txtMyTextBox" runat="server" Width="100%" style="position: relative;"/>
</td>
</tr>
</tbody>
</table>
这不是最漂亮的解决方案,但我已经确认它可以跨所有浏览器工作.我在这个问题HERE上写了一篇文章.
希望这有帮助.
