見出し画像

【HTML・CSS学習】list-style- position

olのli番号(マーカー)部分が親要素からはみ出て、思うようにレイアウトできず苦闘しました。
テキスト部分は動かせるのに数字だけが言うことを聞かず、なぜ?なぜ?とググってググって何とか解決。
自分の疑問はみんなの疑問(のハズ)なので、いろんなサイトを参考にさせてもらってます。
「?」が解決できて思うように画面が表示されるとめちゃくちゃ嬉しいです!

今日の学習でlist-style-positionにoutsideとinsideという概念があることを知りました。
マーカー部分を左端の基準とするか、テキストを左端の基準とするかの違いで、初期値はテキストの方だそうです。「だからはみ出るのか!」と超納得!

ドットインストールを見直すとlist関連の説明動画があって、何度か再生していて真似してコードも書いていたけど、やはり実際に使わないと。。。忘れますよね。


模写して自力で書いてみて初めて知る。
コツコツ学ぶのみ、少しずつでも継続します。