回答編集履歴
2
テックアカデミーの環境が古い可能性が高いことを示唆
test
CHANGED
|
@@ -25,3 +25,37 @@
|
|
|
25
25
|
質問者さんのコードが正しいと言えます。
|
|
26
26
|
|
|
27
27
|
また、`<!doctype html`の不足した記述も、正しいCSS解釈の妨げになっている可能性が大いにあります。
|
|
28
|
+
|
|
29
|
+
|
|
30
|
+
|
|
31
|
+
# 追記（質問修正依頼コメント蘭のやりとりから原因を考察）
|
|
32
|
+
|
|
33
|
+
Lhankor_Mhyさんが提示してくださった、
|
|
34
|
+
|
|
35
|
+
[HTML - only-childがHTML全体に反映されてしまう。｜teratail](https://teratail.com/questions/181932)
|
|
36
|
+
|
|
37
|
+
においても、質問者さんと同じ状況で悩まれているものとなっております。
|
|
38
|
+
|
|
39
|
+
また、
|
|
40
|
+
|
|
41
|
+
K_3578さんがおっしゃる通り、
|
|
42
|
+
|
|
43
|
+
講師さんと同様のHTMLコードでも、表示に食い違いが起きるようです。
|
|
44
|
+
|
|
45
|
+
（上記質問内においても、質問者さんは同様の現象を訴えられていますね）
|
|
46
|
+
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
そして、講師さんのウィンドウUIを見るに、
|
|
50
|
+
|
|
51
|
+
**かなり古いmacOS**のものとお見受けします。
|
|
52
|
+
|
|
53
|
+
|
|
54
|
+
|
|
55
|
+
以上から、考えるに、
|
|
56
|
+
|
|
57
|
+
**テックアカデミー側の環境が古すぎるため、CSS解釈が異なるGoogle Chromeを使用している**可能性が浮上してきました。
|
|
58
|
+
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
追記での可能性が黄金のような気がします。
|
1
より詳しく原因等を記載
test
CHANGED
|
@@ -20,6 +20,8 @@
|
|
|
20
20
|
|
|
21
21
|
|
|
22
22
|
|
|
23
|
-
上記の記述は、レスポンシブレイアウト時には、特に重要な記述のため、
|
|
23
|
+
上記の`<meta name="viewport" content="hogehoge">`の記述は、レスポンシブレイアウト時には、特に重要な記述のため、
|
|
24
24
|
|
|
25
25
|
質問者さんのコードが正しいと言えます。
|
|
26
|
+
|
|
27
|
+
また、`<!doctype html`の不足した記述も、正しいCSS解釈の妨げになっている可能性が大いにあります。
|