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