form欄の幅を狭くしたい

Question

bootstrapでHTMLを書いていますが、form欄を小さくする場合はどのような記述がいいでしょうか。

	<footer>
		<span class="HELLO">GET IN TOUCH</span>
		
		<div class="container">
			<div class="row">
				<div class="col-6 ml-1 mr-1">
				<form>
					<div class="form-group">
						NAME:
						<input type="text" class="form-control" id="formGroupExampleInput" placeholder="">
					</div>
				</form>
			</div>
			<div class="col-6 ml-1 mr-1">
				<form>
					<div class="form-group">
						EMAIL ADDRESS:
						<input type="text" class="form-control" id="formGroupExampleInput" placeholder="">
					</div>
				</form>
			</div>
		</div>
		</div>
		ABOUT YOUR PROJECT:
		<input class="form-control" type="text" placeholder="Default input">
	</footer>

Answer 1

フォームの大きさが統一なら.form-controlのwidthとかを指定してやればいいですし、
個別ならクラス名を分けてやれば良いと思います。

Comments

[K_3578]

ソース検証してたら回答被ったし出遅れた･･･

[Asopasomaso]

bootstrap自体にも.form-controlなどの調整方法があるのですね。ご指摘ありがとうございます。

[Asopasomaso]

すいません。前者の回答の方で解決してしまったので前者をベストアンサーにさせていただきました。K_3578様のご指摘も大変参考になりましたので、また回答していただければ幸いです。

[K_3578]

いや、ただ単に提示のソースではクラス名がそうなってたので挙げてみただけです。
Bootstrapあんまり使ってないので若しかすると的外れかもしれない

[K_3578]

>質問者さん
ご配慮感謝します。自分はベストアンサー貰いたくて回答してるわけじゃないので、解決出来ればなにより。

Answer 2

どれくらいのサイズにするかによりますが、ブロック内幅100%の設定になってるはずなので、任意の幅のクラスを自前で用意し、あてたら良いと思います。cssは基本後勝ちです。

蛇足ですが、formタグをコントロール毎に囲う意味はまったくないと思います。個別に且つコントロールからエンター送信しかしないわけではないですよね。

Comments

[Asopasomaso]

幅変更できました！追加のご指摘もありがとうございます！

[m.ts10806]

cssは基本後勝ち
というのを覚えておけば様々な場面で対応できます。

[Asopasomaso]

大変勉強になります。ご回答ありがとうございました。