如何使用 CSS 设置 textarea 的宽度和高度？
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/10658624/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How do I set the width and height of a textarea using CSS?
提问by Joe
Here is my css:
这是我的CSS：
.editor-field textarea {
width : 400;
height : 100px;
}
Here is the markup from my view:
这是我认为的标记：
<div class="editor-field">
@Html.EditorFor(model => model.Visit.BehavioralObservations)
@Html.ValidationMessageFor(model => model.Visit.BehavioralObservations)
</div>
And here is the annotation of my model showing the MultilineText attribute:
这是我的模型的注释，显示了 MultilineText 属性：
[DisplayName("Behavioral Observations")]
[DataType(DataType.MultilineText)]
public string BehavioralObservations { get; set; }
Why can't I set the width of this textarea? I can adjust the height in my CSS and it looks correct (verified with Chrome Developer tools) but the width doesn't change. Chrome says the width is an invalid property value and has a strike-through applied to the property along with a yellow triangle displayed adjacent to the property.
为什么我不能设置这个textarea的宽度？我可以在我的 CSS 中调整高度，它看起来正确（使用 Chrome 开发者工具验证），但宽度不会改变。Chrome 表示宽度是一个无效的属性值，并且在该属性上应用了删除线，并在该属性旁边显示了一个黄色三角形。
FYI, this is not limited to Chrome. IE8 has the same issue.
仅供参考，这不仅限于 Chrome。IE8 也有同样的问题。
Thoughts? How do I fix this? Thanks!
想法？我该如何解决？谢谢！
回答by vfabre
try to use TextAreaForhelper method and set colsand rowshtml property
尝试使用TextAreaFor辅助方法并设置cols和rowshtml 属性
Sample
样本
@Html.TextAreaFor(model=>model.MyMultilineText, new {rows="6", cols="10"})
I Hope this help. Regards.
我希望这有帮助。问候。
回答by Michael Gattuso
You left off px:
你离开了px：
.editor-field textarea {
width : 400px;
height : 100px;
}
回答by f4d0
After some time searching for it, the best way is to use one of the overloadsof the method TextAreaFor()
经过一段时间的搜索，最好的方法是使用方法TextAreaFor()的重载之一
@Html.TextAreaFor(model => model.Visit.BehavioralObservations, 10, 40, new { HtmlAttributes = new { } })
The 10 is the number of rows, the 40 is the number of columns
10是行数，40是列数
回答by Onyekachi Achigbu
Code:
代码：
@Html.TextAreaFor(m => m.Message, 30, 10, new { @class = "what" })
回答by patrick
ASP MVCdefault project has site.csswith
max-width:280for textarea-- remove that and try something like this
ASP MVC默认的项目有site.css与
max-width:280对textarea-删除和尝试这样的事情
@Html.TextAreaFor(model => model.ComicText, new { style = "width: 700px; height:150px;" })
回答by Vetronom
style can be specified in the link will
样式可以在链接中指定
@Html.TextAreaFor(model => model.values, new {style = "width: 700px; height:200px;"})
@Html.TextAreaFor(model => model.values, new {style = "width: 700px; height:200px;"})
