ancho del área de texto de opa - css, twitter-bootstrap, área de texto, opa

Estoy usando bootstrap y opa para mostrar un área de texto, y no logro abarcar mi área de texto en todo el ancho de la pantalla.

Estoy usando el siguiente código simple:

import stdlib.themes.bootstrap;
import stdlib.widgets.bootstrap;

WB = WBootstrap;

textInput = <textarea style="width=30%" rows=30> This is a text area </textarea>
text2Input = <textarea style="width=100%" rows=1> another textarea </textarea>


content = WB.Grid.row([{span:4, offset:none, content: text2Input}]) <+>
WB.Grid.row([{span:16, offset:none, content: textInput}])



Server.start(
Server.http,
[
{page: function() {content}, title: "test" }
]
)

También trato de usar el siguiente css:

textarea
{
border:1px solid #999999;
width:10%;
margin:5px 0;
padding:3px;
}

Pero tampoco funciona.

Parece que WBoostrap anula todos mis cambios. El estilo "ancho: 100%" no aparece en el xhtml generado por opa.

¿Cuál es la forma correcta de hacer eso?

Gracias

Respuestas

Bueno, hay múltiples problemas en su código:

• Primero, hay un error tipográfico: es style="width:100%"

• En segundo lugar, Twitter Bootstrap 2.0 ahora tiene 12 columnas de ancho, por lo que span16 no tiene sentido, puedes escribir span12 a lo sumo (si miras http://bootstrap.opalang.org, dice hasta 16 porque fue escrito para BS <= 1.4)

• Tercero, ¿dónde escribiste CSS? Si está directamente en Opa (css = ...), de hecho está sobrescrito por Bootstrap CSS (ya que Opa CSS se incluirá antes que todos los demás recursos), por lo que probablemente necesitará incluir un CSS externo (puede tener un mirar https://github.com/Aqua-Ye/OpaChat)

• Finalmente, WBootstrap.Grid Realmente no parece estar adaptado para hacer elementos de ancho 100%.