CSS   发布时间:2022-04-17  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了css – 如何防止textarea伸展超出他的父DIV元素? (仅限Google Chrome版)大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
如何防止textarea扩展超出其父DIV元素?

我有这个textarea在一个表内的一个DIV,它似乎导致整个表伸出它的边界。

你可以看到一个相同情况的例子,即使在更简单的情况下,只是把一个文本区域内的div(像这里使用的在www.stackoverflow.com)

你可以从下面的图像看到textarea可以超出其父的大小?如何防止这种情况?

我是一个新的CSS,所以我真的不知道@R_440_10675@用的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样式中声明的百分比,但仍然可以让它的父表达到它想要的大小,然后你可以看到它溢出它的父边界。
任何想法如何解决这个?

解决方法

要完全禁用调整大小:
textarea {
    resize: none;
}

或者你可以限制大小:

textarea {
    max-width: 100px; 
    max-height: 100px;
}

要将大小限制为父级宽度和/或高度:

textarea {
    max-width: 100%; 
    max-height: 100%;
}

大佬总结

以上是大佬教程为你收集整理的css – 如何防止textarea伸展超出他的父DIV元素? (仅限Google Chrome版)全部内容,希望文章能够帮你解决css – 如何防止textarea伸展超出他的父DIV元素? (仅限Google Chrome版)所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。