Come posso impostare la larghezza e l'altezza di una textarea usando i CSS?

Question

Ecco il mio css:

.editor-field textarea { 
    width : 400; 
    height : 100px; 
} 

Ecco il markup dal mio punto di vista:

 <div class="editor-field"> 
      @Html.EditorFor(model => model.Visit.BehavioralObservations) 
      @Html.ValidationMessageFor(model => model.Visit.BehavioralObservations) 
     </div> 

Ed ecco l'annotazione del mio modello che mostra l'attributo MultilineText:

[DisplayName("Behavioral Observations")] 
    [DataType(DataType.MultilineText)] 
    public string BehavioralObservations { get; set; } 

Perché non posso impostare la larghezza di questa textarea? Posso regolare l'altezza nel mio CSS e sembra corretto (verificato con gli strumenti di sviluppo di Chrome) ma la larghezza non cambia. Chrome afferma che la larghezza è un valore di proprietà non valido e ha un strike-through applicato alla proprietà insieme a un triangolo giallo visualizzato adiacente alla proprietà.

FYI, questo non è limitato a Chrome. IE8 ha lo stesso problema.

Pensieri? Come posso risolvere questo? Grazie!

Answer 1

si era interrotto px:

.editor-field textarea { 
    width : 400px; 
    height : 100px; 
} 

Answer 2

tenta di utilizzare TextAreaFor metodo di supporto e impostare cols e rows proprietà html

Esempio

@Html.TextAreaFor(model=>model.MyMultilineText, new {rows="6", cols="10"}) 

Spero che questo aiuto. Saluti.

Answer 3

stile può essere specificato nel link sarà

@ Html.TextAreaFor (modello => model.values, new {style = "width: 700px; height: 200px;"})

Answer 4

Dopo un po ' tempo alla ricerca di esso, il modo migliore è usare una delle sovraccarichi del metodo TextAreaFor()

@Html.TextAreaFor(model => model.Visit.BehavioralObservations, 10, 40, new { HtmlAttributes = new { } }) 

il 10 è il numero di righe , il 40 è il numero di colonne

Answer 5

Codice:

@Html.TextAreaFor(m => m.Message, 30, 10, new { @class = "what" }) 

Answer 6

progetto predefinito

ASP MVC ha site.css con max-width:280 per textarea - rimuovere tale e provare qualcosa di simile

@Html.TextAreaFor(model => model.ComicText, new { style = "width: 700px; height:150px;" })