メモ(*'ω'*)
課題は無事合格(*‘ω‘ *)
今回はそれをこなす途中で起こった2つの問題の原因まとめ。
検索フォームボタンを角丸にしようとCSSでborder-radiusを記述すると、謎の影が現れた現象
原因は検索ボタンにborderを指定していなかったからだということが判明した!どうやらブラウザのデフォルトの仕様だったみたいで解決してスッキリ('ω')✨
floatで横並びにしたリストの中央揃え
あっけなくできたwww
普通にul要素に幅や高さを指定してあげるだけw
なんで思いつかなかったのか。
まあ、ul要素はサイズ指定してあげないと動かせないということだ('ω')ノ
そして今更要素にidとclassどちらも指定できることを知るwww
これで痒いところに手が届く('ω')ノ
あと、料理画像とその料理名のように、画像+タイトルのように表示にさせたいときのfigcaptionの存在をすっかり忘れ、普通にpタグを使っていたことw
知っているのに活かせていないことが多すぎぃ!
そういう類で言えば、あとは、アイコンの隣に文字を並べるときに、アイコン画像をhtmlにベタ貼りしてCSSに
vertical-align: middle;
を記述してアイコンと文字の高さを合わせるのではなく、
background: url('arrow.png') no-repeat left center;
のような記述が良いこともだ。
グローバルナビなどの横並びリストは必ずしもfloatで作る必要はなく、むしろtableタグを使えば回り込みの解除や横幅の計算の手間を気にせずできるということ。
そしてそして、ずっと欲しいと思っていて買えてなかったこの本も購入!
- 作者: Robin Williams,吉川典秀
- 出版社/メーカー: 毎日コミュニケーションズ
- 発売日: 2008/11/19
- メディア: 単行本(ソフトカバー)
- 購入: 58人 クリック: 1,019回
- この商品を含むブログ (105件) を見る
いろんなところで評価が高かったのでずっと欲しいと思っていたのだ。
やっと買えてご満悦🎶
読み込んでデザインの基本知識をつけたいと思います📕