前回からずっとハマっています・・・
進度
- mainの画像付きリストを横並びにしたい
-
レッスン内では画像付きリストは縦に並べ、説明をその横に付ける形になっているが、 これを画像を横並びにして、説明をその下に付けたい。
メモ
- ハマってるその1
- とりあえず
li
にfloat;left;
をつけてみたけど、横並びにならない。 - ハマってるその2
-
css
を最初から見直し、width
を%で指定しているところをPXに直す。- そもそもなぜ%で指定したのか
- 伸縮させても
main-container
の中央配置を維持させようとしたからです。 最初PXで指定したところ、伸縮に合わせてついてきてしまったので%で指定していました。 - 上記の改善
- 伸縮させても
main-conteiner{position: absolute; top:0; bottom:0; right:0; left:0; margin: auto; }
これで常に中央配置を保てる技を見つけました。
-
menu
の幅を%からPXにしたところ、中央配置が崩れた。- 今ここです。
ひとまず頭の中整理させるために一度メモっときます。
*ちなみに書きながら最初の画像付きリストについて、もしかしてli
にfloat
つけたのがいけなかったのでは?と思い、試しにli>img
に付けてみたところ効きました。
しかしレイアウトはだだ崩れなのでmenuの問題が解決したら考えてみようと思います。
結局width
の指定の仕方は関係なかったってことですね・・・ - そもそもなぜ%で指定したのか