我在Chrome浏览器中重新调整文本区域的大小时出现问题。当我重新调整文本区域的大小,然后重新调整大小回到正常大小时,div不会重新调整大小到正常大小。问题是因为我使用的是“style =”display:table“有没有人知道这方面的解决方法?您应该能够使用以下代码复制我的问题http://jsfiddle.net/uJ7U6/
<div style="display: table;">
<div style="display: table-row">
<div style="display: table-cell;">
<span style="font-weight: bold">TextArea 1</span>
</div>
<div style="display: table-cell;">
<span class="dialogControlLabel">TextArea 2</span>
</div>
<div style="display: table-cell;">
<span style="font-weight: bold">TextArea 3</span>
</div>
</div>
<div style="display: table-row">
<div style="display: table-cell;">
<textarea id="txtTextArea1" rows="3" cols="30"></textarea>
</div>
<div style="display: table-cell;">
<textarea id="txtTextArea2" rows="3" cols="30"></textarea>
</div>
<div style="display: table-cell;">
<textarea id="txtTextArea3" rows="3" cols="30"></textarea>
</div>
</div>
</div>
<div>
<div style="display: table-row">
<div style="display: table-cell;">
<span class="dialogControlLabel">TextArea 4</span>
</div>
<div style="display: table-cell;">
<span class="dialogControlLabel">TextArea 5</span>
</div>
<div style="display: table-cell;">
<span class="dialogControlLabel">TextArea 6</span>
</div>
</div>
<div style="display: table-row">
<div style="display: table-cell;">
<textarea id="txtTextArea4" rows="3" cols="30"></textarea>
</div>
<div style="display: table-cell;">
<textarea id="txtTextArea5" rows="3" cols="30"></textarea>
</div>
<div style="display: table-cell;">
<textarea id="txtTextArea6" rows="3" cols="30"></textarea>
</div>
</div>
</div>
答案 0 :(得分:0)
我能够在你的小提琴中复制这个问题。我使用的是Chrome版本29.0.1547.76。
我所要做的就是为textarea添加一个CSS声明。
textarea {
vertical-align:top;
}
这让我可以调整任何textareas的大小,让<td>
响应大小的变化。
e.g。从小到大到小。
在你修改过的小提琴上测试一下: http://jsfiddle.net/uJ7U6/1/