回答編集履歴
2
「flex: 0 0 50%;」の記述を追加
answer
CHANGED
|
@@ -17,4 +17,15 @@
|
|
|
17
17
|
メディアクエリ内のCSSセレクタの詳細度が、
|
|
18
18
|
メディアクエリの前に記述されているものを上回らないと上書きされません。
|
|
19
19
|
|
|
20
|
-
メディアクエリの記述を問題なさそうなので、「CSSセレクタの詳細度」に注目して調べてみると解決できるかもしれません。
|
|
20
|
+
メディアクエリの記述を問題なさそうなので、「CSSセレクタの詳細度」に注目して調べてみると解決できるかもしれません。
|
|
21
|
+
|
|
22
|
+
---
|
|
23
|
+
|
|
24
|
+
また、別の視点として、以下の記述もヒントになるかもしれません。
|
|
25
|
+
```CSS
|
|
26
|
+
@media screen and (max-width: 768px) {
|
|
27
|
+
.feature {
|
|
28
|
+
flex: 0 0 50%;
|
|
29
|
+
}
|
|
30
|
+
}
|
|
31
|
+
```
|
1
修正しました。
answer
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
[こちらで試したところ](https://codepen.io/new1ro/pen/KKpOELg)、問題なくレスポンシブの実装ができているようでした。
|
|
2
|
+
|
|
1
3
|
例えば以下の場合、メディアクエリ内で指定した背景色「赤」は無視され、
|
|
2
4
|
メディアクエリの前の背景色「青」のままになります。
|
|
3
5
|
|