Html.TextAreaFor 宽度不变

Question

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

@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 属性。如果是这样，那么您需要做的就是我们使用以下代码来覆盖它。

-- 如果您只将单个模型绑定(bind)到您的 View ，则可以使用此代码

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

--- 或 ---

--- 如果您要绑定(bind)模型列表中的模型，请使用此代码

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

注意:

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

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