TextAreaFor无法设置宽度

我无法在atextarea中设置宽度或列数。行/高度工作得很好。有人可以帮忙谢谢！TextAreaFor无法设置宽度

@using (Html.BeginForm()) 
{ 
    @Html.AntiForgeryToken() 

    @Html.ValidationSummary(true) 
    @Html.TextAreaFor(model => model.Comments, new {cols=60, rows=10}) 
    @Html.HiddenFor(model => model.UserName, new { UserName = @User.Identity }) 

    <div class="form-group"> 
     <div class="col-md-10"> 
      <input type="submit" value="Submit Feedback" class="btn btn-default" /> 
     </div> 
    </div> 
}

任何建议或提示将大大appricated！感谢

呈现的HTML是（我删除名称和值文本出于安全原因：

<form action="/feedback/create" method="post"><input name="" type="hidden" value="">   
<textarea name="Comments" id="Comments" rows="10" cols="60"></textarea> 
<input name="UserName" id="UserName" type="hidden" value="" username="System.Security.Principal.WindowsIdentity">   

<div class="form-group"> 
     <div class="col-md-10"> 
      <input class="btn btn-default" type="submit" value="Submit Feedback"> 
     </div> 
</div>

编辑：

我可以通过CSS设置textarea的宽度，但只有一定范围（可能是屏幕的15％）

来源

2014-03-06 MGot90

页面中呈现的HTML是什么？ –

我更新了问题，以显示HTML – MGot90

所以我想通了，我相信这是导入到ASP.NET MVC5项目的引导问题。答案很简单。只需设置CSS

max-width: 1000px; 
    width: 1000px;

修复了所有数据类型的问题。多行文本，输入等

**** UPDATE 2014年8月26日 ****

改变了我的答案，以反映上发布的评论。使用百分比而不是px来保持响应。 CSS的应该是：

max-width: 100%; 
    width: 100%;

**** UPDATE 2016年8月29日 ****

这是固定的引导3.添加类形式控制其应用以上造型

 @Html.TextAreaFor(x => x.Note, new { @class = "form-control", rows = "3" })

来源

2014-03-07 20:07:38 MGot90

竖起大拇指如果这也适用于你！ – MGot90

它也适用于我。我不认为这是完美的解决方案，但它是我迄今唯一找到的唯一一个。我已经搜索过...... –

@ MikeGO10590：检查一下：如果将max-width更改为100％而不是1000px，则会获得引导大小调整功能。你甚至不需要麻烦设置宽度。 –

您的代码对我来说很好，请查看fiddle demo

的问题将与style=width:something

更好的检查CSS并尝试与萤火/铬控制台的帮助来解决

来源

2014-03-06 16:21:36

这几乎工作，但我没有把它设置为整个div的宽度！ – MGot90

您可以添加一个class属性：

@Html.TextAreaFor(model => model.Comments, new {cols=60, rows=10, @class="form-control" })

来源

2014-03-06 16:23:03

这几乎工作，但我没有把它设置为整个div的宽度！ – MGot90

如果将'form-control'类添加到textarea，则可以将输入扩展到其父容器。我已经更新了我的答案。 –

我试过（从bootstrap API复制的代码），它仍然最大出 – MGot90

我有同样的问题，并发现我的Site.css中的以下一块CSS是原因（我注释掉了）。

/* Set width on the form input elements since they're 100% wide by default */ 
input, 
select, 
textarea { 
    max-width: 280px; 
}

来源

2015-03-25 12:10:02

真的很好。我只是从那里删除了textare，它工作。 –

哦，谢谢你，谢谢你，谢谢你！就是这样！（愚蠢的默认Site.css！）真正令人沮丧的是，我很确定我已经处理过这个，显然忘记了。（D'OH！）;） –

这似乎是回退以防止脚手架视图生成全宽度输入表单。

但是现在我们知道它正在被设置，我们可以在一个类中或直接在元素上本地覆盖它（纯粹为了下面的简单显示）。

关键是要记住设置最大宽度来覆盖site.css中的宽度以及宽度CSS属性。

@Html.TextAreaFor(model => model.Comments, 10, 120, htmlAttributes: new {style="width: 100%; max-width: 100%;" })

来源

2015-06-08 18:31:53

TextAreaFor无法设置宽度

回答

相关问题