0

ブートストラップとopaを使用してテキストエリアを表示していますが、画面幅全体にテキストエリアをまたがることができません。

私は次の簡単なコードを使用しています：

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が私のすべての変更を上書きしているようです。「width：100％」スタイルは、opaによって生成されたxhtmlには表示されません。

それを行うための正しい方法は何ですか？

ありがとう

4

1 に答える 1

1

あなたのコードには複数の問題があります：

  • まず、タイプミスがあります：それはstyle="width:100%"

  • 次に、Twitter Bootstrap 2.0は12列幅になっspan16ているため、意味がありません。span12最大で書き込むことができます（http://bootstrap.opalang.orgを見ると、BS <= 1.4用に記述されているため、最大16と表示されます。 ）。

  • 第三に、CSSをどこに書きましたか？Opaに直接ある場合（css = ...）、実際にはBootstrap CSSによって上書きされるため（Opa CSSは他のすべてのリソースの前に含まれるため）、おそらく外部CSSを含める必要があります（https://github.com/Aqua-Ye/OpaChat）

  • 最後に、WBootstrap.Grid100％幅の要素を作成するように実際に適合されているようには見えません。

于 2012-04-30T21:28:31.127 に答える