回答編集履歴
1
説明の改善
answer
CHANGED
|
@@ -1,8 +1,3 @@
|
|
|
1
|
-
`position: absolute;`は通常フローから外れで浮いた状態になる（他の要素からは存在しないものとして扱われる）ので、親要素の高さが0になり、下の要素がその分上に移動して、重なった状態になります。
|
|
2
|
-
親要素（この場合は、`.info`）に適切な高さを設定すればいいでしょう。
|
|
3
|
-
|
|
4
|
-
ただ、レスポンシプ対応を考えると高さが変化することも考えれるので、適切な高さというのもなかなか難しいことがあります。
|
|
5
|
-
|
|
6
1
|
ヘッダー画像を背景画像としてその上にテキストを重ねて表示させたいという目的なら、img要素、`position: absolute;`は使わずに、ヘッダー画像を`background-image`で表示させるのが簡単だと思います。
|
|
7
2
|
|
|
8
3
|
```html
|