回答編集履歴
1
fix typo
answer
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
方法1. flexレイアウトにする
|
|
2
2
|
|
|
3
|
-
li要素を`flex-direction: column`, `justify-content: space-between`のflexレイアウトにして、文章（`.features-info`）より上の部分と画像より下の部分をdiv
|
|
3
|
+
li要素を`flex-direction: column`, `justify-content: space-between`のflexレイアウトにして、文章（`.features-info`）より上の部分と画像より下の部分をdivかなんかでラップすれば、それらが上下に配置されるため行数に関わらず画像の位置は一定になります。
|
|
4
4
|
|
|
5
5
|
---
|
|
6
6
|
|
|
@@ -12,4 +12,4 @@
|
|
|
12
12
|
|
|
13
13
|
方法3.文章エリアの高さを指定する
|
|
14
14
|
|
|
15
|
-
結局は行数によって文章エリアの高さが変わってしまうのが問題なので、エリアの高さを指定すれば良いです。ただpx指定だとウィンドウが狭くて行数が多くなったときと、広くて行数が少ないときでエリアの高さが変わらないため、画像との隙間の大きさが変わってしまいます。そのため全体的に`vw`などで指定する必要が出てくると思います。
|
|
15
|
+
結局は行数によって文章エリアの高さが変わってしまうのが問題なので、エリアの高さを指定すれば良いです。ただpx指定だとウィンドウが狭くて行数が多くなったときと、広くて行数が少ないときでエリアの高さが変わらないため、ウィンドウ幅によって画像との隙間の大きさが変わってしまいます。そのため全体的に`vw`などで指定する必要が出てくると思います。
|