我可以设置我的视图中的EditorFor控制的宽度?
我设置了几个参数:
[Required, DisplayName("Payee Name"), StringLength(50)]
public string Name { get; set; }
不过,我似乎无法设置获取呈现文本框的宽度。
<table width="300" border="0" cellpadding="3" cellspacing="0">
<tr>
<td>
<%=Html.LabelFor(m => m.Name)%>
</td>
<td>
<%=Html.EditorFor(m => m.Name)%>
</td>
</tr>
可以这样做不知何故?
我试过了:
<%=Html.EditorFor(m => m.Name, new {width=50)%>
但没有喜悦......
相反EditorFor的,使用TextBoxFor:
<%=Html.TextBoxFor(m => m.Name, new {style = "width:50px"})%>
在对的site.css你的CSS文件,默认最大宽度为280像素,如果你有VS自动生成你的一切,当你第一次创建MVC项目。不管你多么大的宽度的设置与给定的ID您@html.editorfor
,它是由下面的语法限制。
input,
select,
textarea{
max-width:280px
}
你可以给它一个新的最大宽度或最大高度在此处进行更改。
对于ASP.NET核心:
<%=Html.TextBoxFor(m => m.Name, new { htmlAttributes = new { style = "width: 50px" } })%>
以上回答Yes和No.我们需要使用开发工具来检查使用了什么方式和修改它们,它们可能具有最大宽度,宽度;然后创建应用它自己重要的CSS,我的情况!
<style>
textarea,
input[type='text'],
.form-group,
.form-group-lg,
.form-horizontal,
.form-control,
.text-box,
.single-line,
.multi-line{
width: 800px !important;
max-width: 1000px !important;
}
.multi-line{
height: 300px !important;
}
.form-horizontal{
position:absolute;
padding-left:15%;
}
</style>
见所附图像的结果。
这有什么错用CSS风格你控制宽度是多少?
在MVC 5存在的site.css用于设置最大宽度= 200的所有文字区域设置。这让我感到困惑,直到我发现我这篇文章。 http://weblogs.asp.net/paullitwin/visual-studio-2013-asp-net-mvc-5-scaffolded-controls-and-bootstrap保罗利温所说的那样:
是的,微软是由于某些原因的所有输入,选择和textarea的控制的最大宽度设定为280个像素。不知道这背后的动机,但直到你改变这个或通过分配形式控制一些其他的CSS类overrride这一点,你的控制将永远无法超过280像素宽。
/* Set width on the form input elements since they're 100% wide by default */
input,
select,
textarea {
max-width: 280px;
}
所以,你如果你是一个务实的,你改变最大宽度到例如600px的
更换<%=Html.EditorFor(m => m.Name, new {width=50)%>
此
<%=Html.EditorFor(m => m.Name,new { htmlAttributes = new { style = "width: 50px" }, }
自举3
@Html.EditorFor(model => model.PriceIndicatorDesc, new { htmlAttributes = new { @class = "form-control", @style = "width:280px" } })
您可能需要添加“!重要”的CSS属性,以确保它会覆盖TextBoxFor例如默认!宽度:50px的重要;
正如前面提到的,你想要去的地方是的site.css
input,
select,
textarea {
max-width: 280px;
}
你可以设置你想要的任何缺省值存在或删除块获得100%的引导默认。就个人而言,我添加了以下选项,所以我可以很容易地根据问题的控制和领域的一些变化:
.form-control-25 {
max-width: 25%;
}
.form-control-50 {
max-width: 50%;
}
.form-control-75 {
max-width: 75%;
}
.form-control-100 {
max-width: 100%;
}
如果你需要一个自定义的宽度正常的CSS规则之外,你正在使用的模板编辑器,你可以做
<%=Html.EditorFor(m => m.Name, new { Width = 50})%>
然后在字符串编辑器模板添加到您的模板
@Html.TextBox(s => {
...
if (ViewBag.Width != null )
{
s.Width = ViewBag.Width;
}
}).Bind(Model).GetHtml()
帕特里克Lindström的是与最大宽度正确的。
我能够通过设置最大宽度和宽度来解决这个问题
@Html.EditorFor(model => model.Source, new { htmlAttributes = new { @class = "form-control", @placeholder = "Source", @style = "width: 900px;max-width: 900px;" } })