teratail header banner
teratail header banner
質問するログイン新規登録

質問編集履歴

1

追加

2020/05/10 09:02

投稿

sshino
sshino

スコア16

title CHANGED
File without changes
body CHANGED
@@ -3,4 +3,52 @@
3
3
  ![イメージ説明](c440620a40e78cd4c8fcd2c74a7bbd38.png)
4
4
 
5
5
  フォームとボタンのpaddingの幅の判定が異なっているため、見た目が揃いません。
6
- 解決策はないでしょうか?
6
+ 解決策はないでしょうか?
7
+
8
+ ちなみにBootstrap4を使いp-0をaタグを囲ったdivタグに記入してもなおりませんでした。
9
+
10
+ ```HTML
11
+ <div class="container mx-auto">
12
+ <div class="row">
13
+ <div class="col-md-12 p-0">
14
+ <!-- <p>東京</p> -->
15
+ <input type="text" class="form-control mb-2" placeholder="ロケーション" value="東京">
16
+ </div>
17
+ <div class="col-md-7 p-0">
18
+ <!-- <p>まるまる貸切</p> -->
19
+ <select class="custom-select custom-select mb-2">
20
+ <option selected>まるまる貸切</option>
21
+ <option value="1">個室</option>
22
+ <option value="2">シェアルーム</option>
23
+ </select>
24
+ </div>
25
+ <div class="col-md-5 p-0">
26
+ <!-- <p>ゲスト4人</p> -->
27
+ <select class="custom-select custom-select mb-2">
28
+ <option value="1">ゲスト1人</option>
29
+ <option value="2">ゲスト2人</option>
30
+ <option value="3">ゲスト3人</option>
31
+ <option selected>ゲスト4人</option>
32
+ <option value="5">ゲスト5人</option>
33
+ <option value="6">ゲスト6人</option>
34
+ <option value="7">ゲスト7人</option>
35
+ <option value="8">ゲスト8人</option>
36
+ <option value="9">ゲスト9人</option>
37
+ <option value="10">ゲスト10人</option>
38
+ <option value="11">ゲスト11人</option>
39
+ <option value="12">ゲスト12人</option>
40
+ <option value="13">ゲスト13人</option>
41
+ <option value="14">ゲスト14人</option>
42
+ <option value="15">ゲスト15人</option>
43
+ <option value="16">ゲスト16人</option>
44
+ </select>
45
+ </div>
46
+ </div>
47
+ </div>
48
+ <div class="col-12">
49
+ <a href="" class="btn btn-danger btn-block btn-lg mt-3">はじめる</a>
50
+ </div>
51
+ </div>
52
+ </div>
53
+ </div>
54
+ ```