回答編集履歴

1

追記

2022/10/17 23:57

投稿

hatena19
hatena19

スコア33715

test CHANGED
@@ -5,3 +5,41 @@
5
5
   
6
6
  <form class="new_room" id="new_room" action="/rooms" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="kSUvQAhDQZf3W8N63RY9jDnghV8Pu-_rPU9S6LaMWxrIPE6bZaNDlqQpEE0SvWK9TIiJMUMYKsAIJBuHGQx1Fg" autocomplete="off" />
7
7
  ```
8
+
9
+ 追記
10
+ ---
11
+
12
+ ```html
13
+ <div class="plan-content-btn">
14
+ <div class="plan-favorite-btn">
15
+ <p> <form action="/favorites" accept-charset="UTF-8" method="post"><input type="hidden" name="authenticity_token" value="n9MX46nLLJHUEWYoxzMh97yAYrp9vuj364k24U6hG3kNDOKCIzjP0ZO5QXXZzpO8xVrC5dHQ46uTiKqoJ9UcYw" autocomplete="off" />
16
+ <input type="hidden" name="plan_id" id="plan_id" value="4" autocomplete="off" />
17
+ <input type="submit" name="commit" value="お気に入り" class="btn btn-outline-danger btn-lg" data-disable-with="お気に入り" />
18
+ </form> </div>
19
+ </p>
20
+ </div>
21
+ ```
22
+ 上記の部分ですが、整形されていないのでわかりにくいですが、整形すると、下記のようになります。
23
+ コメントをいれた<p>と</p>の対応ができてないので、ブラウザが開始タグと終了タグを補っていて、それが余白になっているようです。
24
+ ```html
25
+ <div class="plan-content-btn">
26
+ <div class="plan-favorite-btn">
27
+ <p> <!-- ココ -->
28
+ <form action="/favorites" accept-charset="UTF-8" method="post"><input type="hidden"
29
+ name="authenticity_token"
30
+ value="n9MX46nLLJHUEWYoxzMh97yAYrp9vuj364k24U6hG3kNDOKCIzjP0ZO5QXXZzpO8xVrC5dHQ46uTiKqoJ9UcYw"
31
+ autocomplete="off" />
32
+ <input type="hidden" name="plan_id" id="plan_id" value="4" autocomplete="off" />
33
+ <input type="submit" name="commit" value="お気に入り" class="btn btn-outline-danger btn-lg"
34
+ data-disable-with="お気に入り" />
35
+ </form>
36
+ </div>
37
+ </p> <!-- ココ -->
38
+ </div>
39
+ ```
40
+
41
+ ブラウザの検証ツールで確認できます。
42
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-10-18/dc2e13be-bc70-4999-b51d-0d99295af0d2.png)
43
+
44
+ <div>で囲んでいるので、さらに<P>で囲む必要はないので<P>は削除すればいいと思います。
45
+