[col-row]フォームで右側だけ項目数を増やしたい

Question

前提・実現したいこと

colとrowがうまく扱えず、右側だけ数を倍ぐらいに増やしたいんですがどうすればできますか？
基本２列で、
左は２つ、右は４つに増やしたいです。
どこをどう変えればいいですか？

該当のソースコード

<div class="form-group row">
    <div class="col-sm-6">
        <label>名前</label>
        <input name="name" class="form-control" required="" type="text">
    </div>
    <div class="col-sm-6">
        <label>メール</label>
        <input name="email" class="form-control" required="" type="text">
    </div>
</div>
<div class="form-group row">
    <div class="col-sm-6">
        <label>年齢</label>
        <input name="age" class="form-control" required="" type="text">
    </div>
    <div class="col-sm-6">
        <label>住所</label>
        <input name="address" class="form-control" required="" type="text">
    </div>
</div>

###　追記 ###
lavelとinputのセットで数を増やしたいです。
ブレークポイントに関しては、中央で区切り幅が狭くなれば全項目が縦に一列に並ぶようにしたいです。徐々に左側にそろっていく感じに。

Comments

[m.ts10806]

左とか右とかどこのことを言っていますか？
あとグリッドについて「幅１００％を１２等分するシステム」ということは理解されていますか？

Answer 1

・labelとinputのセットを増やしたいのか？
・inputだけを増やしたいのか？
や、
・ブレークポイントごとのレイアウトをどうするのか？
によっても書き方が変わってきます。

まずはBootstrapのGrid systemを理解しなければ思い通りのレイアウトは組めないと思います。
https://getbootstrap.jp/docs/4.2/layout/grid/

おそらく入れ子にしたいのかな？と思うので、下記の箇所も参考にされたら良いと思います。
https://getbootstrap.jp/docs/4.2/layout/grid/#nesting

質問の追記を受けての回答です

「中央で区切る」のイメージが掴めないので、サンプルとして書きます。

ブレークポイントは複数あるので、意図していない部分があれば、
.rowのネストの仕方を変更したり.col-**-*を変更したりで調整していただければと思います。

<div class="form-group row">
    <div class="col-sm-6">
      <div class="row">
        <div class="col-md-6">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
        <div class="col-md-6">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
      </div>
    </div>
    <div class="col-sm-6">
      <div class="row">
        <div class="col-sm-6 col-md-3">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
        <div class="col-sm-6 col-md-3">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
        <div class="col-sm-6 col-md-3">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
        <div class="col-sm-6 col-md-3">
          <label>ラベル</label>
          <input class="form-control" type="text">
        </div>
      </div>
    </div>
</div>

コメントを受けての修正コードです

<!-- パターン① -->
<div class="form-group row">
    <div class="col-sm-6">
      <label>ラベル1</label>
      <input class="form-control" type="text">
      <label>ラベル2</label>
      <input class="form-control" type="text">
    </div>
    <div class="col-sm-6">
      <label>ラベル3</label>
      <input class="form-control" type="text">
      <label>ラベル4</label>
      <input class="form-control" type="text">
      <label>ラベル5</label>
      <input class="form-control" type="text">
      <label>ラベル6</label>
      <input class="form-control" type="text">
    </div>
</div>

<!-- パターン② -->
<div class="form-group row">
    <div class="col-sm-6">
      <label>ラベル1</label>
      <input class="form-control" type="text">
    </div>
    <div class="col-sm-6">
      <label>ラベル2</label>
      <input class="form-control" type="text">
    </div>
  
    <div class="col-sm-6">
      <label>ラベル3</label>
      <input class="form-control" type="text">
    </div>
    <div class="col-sm-6">
      <label>ラベル4</label>
      <input class="form-control" type="text">
      <label>ラベル5</label>
      <input class="form-control" type="text">
      <label>ラベル6</label>
      <input class="form-control" type="text">
    </div>
</div>

Comments

[退会済みユーザー]

そうですね失礼しました。
追記いたします。

[退会済みユーザー]

知識不足でお手数おかけしますが、ご教授いただければ幸いです。

[退会済みユーザー]

お休みの中ありがとうございます。
言葉足らずでたびたび申し訳ありません。
"基本２列"というのは中央で区切った場合で２列です。つまり、
---------------------------
ラベル　　　ラベル
ラベル　　　ラベル
　　　　　　ラベル
　　　　　　ラベル
----------------------
というようにしたいんです。これはグリッドでは不可能ですか？divで囲ったりすれば一番早いですかね？

[退会済みユーザー]

であればただ下にlabelとinputを足せばいいと思います。

並び方によって書き方は異なりますが、回答欄に2パターン書いてます。
labelやinputをdivで囲むなりはお好みで書いたら良いと思います。

※一旦ここにコードを書きましたが、見ずらいので回答欄にかきなおしました。

[退会済みユーザー]

大変勉強になりました。今後も活用させていただきます。
本当にありがとうございました。

[退会済みユーザー]

難しく考えてしまうことも、実は単純にできたりしますね。
公式のドキュメントも全て見るのに時間がかかるかも知れませんが、
その分引き出しが増えると思うので、サンプルコードをいじりながら見てみてください^^