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無法設置寬度

回答

相關問題