¿Cómo configuro el ancho y alto de un área de texto usando CSS?

Question

Aquí es mi css:

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

Aquí es el margen de beneficio de mi vista:

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

Y aquí es la anotación de mi modelo que muestra el atributo MultilineText:

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

Por qué ¿No puedo establecer el ancho de este área de texto? Puedo ajustar la altura en mi CSS y se ve correcto (verificado con las herramientas de desarrollo de Chrome) pero el ancho no cambia. Chrome dice que el ancho es un valor de propiedad no válido y que se aplica una corrección a la propiedad junto con un triángulo amarillo que se muestra junto a la propiedad.

FYI, esto no se limita a Chrome. IE8 tiene el mismo problema.

¿Pensamientos? ¿Cómo puedo solucionar esto? ¡Gracias!

Answer 1

lo dejó px:

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

Answer 2

intenta utilizar TextAreaFor método de ayuda y establecer cols y rows propiedad html

Muestra

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

Espero que esta ayuda. Saludos.

Answer 3

estilo puede ser especificado en el enlace se

@ Html.TextAreaFor (modelo => model.values, nueva {style = "width: 700px; altura: 200px;"})

Answer 4

Después de algún el tiempo en busca de ella, la mejor manera es utilizar una de las sobrecargas del método TextAreaFor()

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

el 10 es el número de filas , el 40 es el número de columnas

Answer 5

Código:

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

Answer 6

proyecto predeterminado

ASP MVC tiene site.css con max-width:280 para textarea - quite eso y tratar algo como esto

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