Html.TextAreaFor 宽度不会改变

Question

如何在 ASP.NET MVC 视图中更改文本区域宽度？我在这里阅读了有关此问题的问题，但没有任何帮助。

@Html.TextAreaFor(m => m.Suggestions, new { @class = "text-area", placeholder = "Unesite svoje prijedloge..." })

CSS：

.text-area {
    width:50%;
    height:100px;
    color:#3A3A3A;
    font-weight:bold;
    font-style:italic;
}

除此以外的所有样式都适用于文本区域宽度。我也试过这个：

@Html.TextAreaFor(m => m.Suggestions, new { rows = "7", cols = "70", @class = "text-area", placeholder = "Unesite svoje prijedloge..." })

但没有结果。

Answer 1

打开开发人员工具并在浏览器中找到输入元素。查看是否在 TextArea 元素上设置了 max-width 属性。如果是这样，那么您需要做的就是我们下面的代码来覆盖它。

-- 如果您只将单个模型绑定到您的视图，则可以使用此代码

@Html.TextArea("NameOfElement", Model.propertyName, new {style = "max-width:100% !important;"})

- - 或者 - -

--- 使用此代码是您从模型列表中绑定模型

@Html.TextAreaFor(m => m.propertyName, new {style="max-width:100%", @id = "ElementId"})        

笔记：

1) 如果您将上述值用于最大宽度，它将从父容器继承。

2) TextArea 帮助中的第一个参数是元素的名称。它还将名称指定为 elementID。在 TextAreaFor 中，您必须显式分配 elementID，如上所示。

Answer 2

HTML：

<form id="myform">
<textarea value="">
</textarea>
</form>

CSS：

#myform textarea{
Width: 50%;
height: 100px;
}