web-dev-qa-db-ja.com

TextAreaForは幅を設定できません

Atextareaで幅または列を設定できません。行/高さは問題なく動作します。誰か助けてくれますか？

@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>
}

アドバイスやヒントは大いに参考になります！ありがとう

レンダリングされる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を介してテキストエリアの幅を設定できますが、特定の範囲（画面の15％程度）にのみ設定できます

twitter-bootstraprazortwitter-bootstrap-3asp.net-mvc-5
18
MGot90

だから私はそれを理解しました、これはbootstrap= ASP.NET MVC5プロジェクトにインポートされた問題です。答えは簡単です。CSSも設定してください。

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

すべてのデータ型で修正されます。テキストエリア、入力など.

**** 2014年8月26日更新 ****

投稿されたコメントを反映するように回答を変更しました。応答性を維持するには、pxではなくパーセンテージを使用します。 CSSは次のようになります。

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

**** 2016年8月29日更新 ****

これは、Bootstrap 3.で修正されました。上記のスタイリングを適用するクラスform-controlを追加します。

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

これは、スキャフォールドビューが全幅入力フォームを生成するのを防ぐためのフォールバックのようです。

ただし、クラスでローカルにオーバーライドすることも、要素上で直接オーバーライドすることもできます（以下の単純化のために純粋に示します）。

重要なのは、max.widthを忘れずに設定して、site.css内のCSSプロパティとwidth CSSプロパティをオーバーライドすることです。

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

同じ問題があり、Site.cssの次のCSSが原因であることがわかりました（コメントアウトしました）。

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

クラス属性を追加できます：

@Html.TextAreaFor(model => model.Comments, new {cols=60, rows=10, @class="form-control" })
5
Andrés Nava - .NET

あなたのコードは私のためにうまく機能します。 fiddle demo

問題はstyle=width:something

CSSをよりよく確認し、firebug/chromeコンソールの助けを借りて修正を試みてください。

1
Murali Murugesan