如何防止文本区域延伸到其父DIV元素之外？(google-仅限chrome问题)
如何防止文本区域延伸到其父DIV元素之外？
我将这个文本区域放在一个表中，这个表在一个DIV中，它似乎导致整个表都超出了它的界限。
即使在更简单的情况下，您也可以看到相同情况的示例，只需在div中放置一个文本区域(就像这里在www.stackoverflow.com中使用的一样)。
你可以从下面的图片中看到文本区可以延伸到超过其父区域的大小？我如何防止这种情况发生？
我是CSS的新手，所以我真的不知道我应该使用什么CSS属性。我尝试了几个类似的显示，并溢出。但他们似乎并没有做到这一点。还有什么我可能错过的吗？
更新: HTML
CSS
textarea {
max-width: 50%;
}
#container {
width: 80%;
border: 1px solid red;
}
#cont2{
width: 60%;
border: 1px solid blue;
} 如果您将此代码放在http://jsfiddle.net中，您将看到它们的行为不同。尽管textarea被限制为在其css样式中声明的百分比，但仍然可以让它使其父表尽可能大，然后您可以看到它溢出了其父边框。对如何解决这个问题有什么想法吗？
回答 2
Stack Overflow用户
发布于 2010-10-10 15:52:19
要完全禁用调整大小，请执行以下操作：
textarea {
resize: none;
}要仅允许垂直调整大小：
textarea {
resize: vertical;
}仅允许水平调整大小的步骤：
textarea {
resize: horizontal;
}或者，您可以限制大小：
textarea {
max-width: 100px;
max-height: 100px;
}要将大小限制为父项宽度和/或高度，请执行以下操作：
textarea {
max-width: 100%;
max-height: 100%;
}Stack Overflow用户
发布于 2015-07-18 13:02:35
我希望你有和我一样的问题...我的问题很简单:在容器中创建一个带有锁定百分比的固定文本区域(我是CSS/JS/HTML的新手，如果我没有正确使用行话，请耐心等待)，这样无论它显示在哪个设备上，填充容器的框(表格单元格)都会占用正确的空间量。下面是我解决这个问题的方法：
<table width=100%>
<tr class="idbbs">
B.S.:
</tr></br>
<tr>
<textarea id="bsinpt"></textarea>
</tr>
</table>那么CSS看起来就像这样...
#bsinpt
{
color: gainsboro;
float: none;
background: black;
text-align: left;
font-family: "Helvetica", "Tahoma", "Verdana", "Arial Black", sans-serif;
font-size: 100%;
position: absolute;
min-height: 60%;
min-width: 88%;
max-height: 60%;
max-width: 88%;
resize: none;
border-top-color: lightsteelblue;
border-top-width: 1px;
border-left-color: lightsteelblue;
border-left-width: 1px;
border-right-color: lightsteelblue;
border-right-width: 1px;
border-bottom-color: lightsteelblue;
border-bottom-width: 1px;
}很抱歉在这里草率的代码块，但我必须告诉你什么是重要的，我不知道如何在这个网站上插入引用的CSS代码。在任何情况下，为了确保你明白我在说什么，重要的CSS在这里不是很缩进……
然后我所做的(如这里所示)是非常明确地调整百分比，直到我找到完全适合显示的百分比，无论使用的是什么设备屏幕。
诚然，我认为" resize : none;“有点夸张，但比抱歉更安全，而且现在消费者将不再需要调整盒子的大小，也不会影响他们从什么设备上观看。
它工作得很好。
https://stackoverflow.com/questions/3899463
复制相似问题
腾讯云开发者
