如何使用CSS设置textarea的宽度和高度?

时间:2012-05-18 19:26:53

标签: css asp.net-mvc

这是我的css:

.editor-field textarea {
    width : 400;
    height : 100px;
}

以下是我认为的标记:

        <div class="editor-field">
            @Html.EditorFor(model => model.Visit.BehavioralObservations)
            @Html.ValidationMessageFor(model => model.Visit.BehavioralObservations)
        </div>

以下是我的模型的注释,显示了MultilineText属性:

    [DisplayName("Behavioral Observations")]
    [DataType(DataType.MultilineText)]
    public string BehavioralObservations { get; set; }

为什么我不能设置此textarea的宽度?我可以在CSS中调整高度,看起来是正确的(使用Chrome Developer工具验证),但宽度不会改变。 Chrome表示宽度是无效的属性值,并且对属性应用了一个删除线以及在该属性旁边显示的黄色三角形。

仅供参考,这不仅限于Chrome。 IE8也存在同样的问题。

思考?我该如何解决?谢谢!

6 个答案:

答案 0 :(得分:51)

尝试使用TextAreaFor辅助方法并设置colsrows html属性

样品

@Html.TextAreaFor(model=>model.MyMultilineText, new {rows="6", cols="10"})

我希望这有帮助。 问候。

答案 1 :(得分:30)

您离开了px

.editor-field textarea {
    width : 400px;
    height : 100px;
}

答案 2 :(得分:15)

经过一段时间搜索后,最好的方法是使用 TextAreaFor()

方法的重载之一
@Html.TextAreaFor(model => model.Visit.BehavioralObservations, 10, 40, new { HtmlAttributes = new { } })

10是的数量,40是列的数量

答案 3 :(得分:4)

代码:

@Html.TextAreaFor(m => m.Message, 30, 10, new { @class = "what" })

答案 4 :(得分:4)

ASP MVC默认项目有site.css max-width:280 textarea - 删除并尝试类似

的内容
@Html.TextAreaFor(model => model.ComicText, new { style = "width: 700px; height:150px;" }) 

答案 5 :(得分:1)

样式可以在链接中指定

@ Html.TextAreaFor(model =&gt; model.values,new {style =“width:700px; height:200px;”})