2

ツイッターのブートストラップを使用できるように、このようなことを行う必要があります。

<fieldset>
    <legend>Main Section</legend>
    <div class="left-column">
        some stuff here
    </div>
    <div class="right->column">
        <fieldset>
            <legend>A form inside</legend>
            form here
        </fieldset>
    </div>
</fieldset>

ブートストラップは、何らかの理由で、境界線なしで通常とは異なるフィールドセットをスタイリングするためのものです。境界線とパディングを追加すると、グリッドを適切に操作できなくなります。結果はいつも私にとって台無しになりました。境界線、いくつかのパディング、境界線の内側のラベルを含むモックアップのように見えるフィールドセットが必要です（簡単です;））。

では、ブートストラップを使用し、その原則に従うことでこれを実現するための最良の方法は何でしょうか。

例

編集：より良いですが、私は何らかの理由で解決策が好きではありません...

        <fieldset class="row fieldset">
            <legend>Main Section</legend>
            <div class="span6">
                some stuff here
            </div>
            <div class="span6">
                <fieldset class="fieldset">
                    <legend>A form inside</legend>
                    form here
                </fieldset>
            </div>
        </fieldset>

.fieldset {
    border: 1px solid #ccc;
    padding: 10px;
}

.fieldset .span6 {
    width: 560px;
}
4

1 に答える 1

3 
<div class='container'>
  <fieldset class="fieldset">
    <legend>Main Section</legend>
    <div class="row-fluid">
      <div class="span6">
        some stuff here
      </div>
      <div class="span6">
        <fieldset class="fieldset">
          <legend>A form inside</legend>
            form here
        </fieldset>
       </div>
  </fieldset>
</div>

.fieldset {
    border: 1px solid #ccc;
    padding: 10px;
}

http://jsfiddle.net/baptme/ppxGG/

于 2012-07-25T15:44:52.993 に答える