Question

我正在使用bootstrap和opa来显示textarea，而我无法在所有屏幕宽度上跨越我的textarea。

我使用以下简单代码：

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" }
   ]
)

我也尝试使用以下css：

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

但它也不起作用。

似乎WBoostrap覆盖了我所有的变化。 “宽度：100％”样式不会出现在由opa生成的xhtml中。

这样做的正确方法是什么？

由于

Answer 1

您的代码中存在多个问题：

首先，有一个拼写错误：它是style="width:100%"
其次，Twitter Bootstrap 2.0现在是12列宽，所以span16没有意义，你最多可以写span12（如果你看http://bootstrap.opalang.org，它说最多16，因为它是为BS＆lt; = 1.4）
第三，你在哪里写CSS？如果它直接在Opa（css = ...）中，它确实被Bootstrap CSS覆盖（因为Opa CSS将被包含在所有其他资源之前），所以你可能需要包含一个外部CSS（你可以查看一下） https://github.com/Aqua-Ye/OpaChat）
最后，WBootstrap.Grid似乎并不适合制作100％宽度的元素。

opa textarea宽度

1 个答案: