给出以下CSS
.comment {
margin: 10px;
display: block;
overflow: auto;
border-top-left-radius: 5px 5px;
border-top-right-radius: 5px 5px;
border-bottom-right-radius: 5px 5px;
border-bottom-left-radius: 5px 5px;
-webkit-Box-shadow: rgba(0,.2) 1px 1px 3px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
min-height: 200px;
width: 100%
}
这适用于textarea但忽略右边距并且textarea离开屏幕.
为什么是这样？
解决方法
通过将宽度设置为100％并且边距为10px,textarea将是100％宽度的容器向下移动并向左移动10px
为了得到您想要的结果,您可能需要在textarea周围使用10px填充物的容器.
见example.
> commentA正在使用带填充的容器
> commentB是您原来的CSS
像这样的东西：
<div class="comment-container">
<textarea class="commentA"></textarea>
</div>
和
.comment-container {
padding:10px;
}
.commentA {
width:100%;
min-height: 200px;
}
开始.
