CSSで画像位置を微調整する方法
画像の微妙な位置が画面のバランスを左右する事があります。少しずらしていってもなかなかしっくりこなかったりもしますが、時間をおいて見直すと改善する事もあります。不思議なものです。
位置移動はmarginでもpaddingでもできる
基本としてmarginの４辺について数字を変えてみましょう。paddingの数字を大きくすると、余白の所に背景色が表示されるからです。背景色がすべて白一色の時等、周りと同じ色の時はpaddingで変えても良いでしょう。paddingは正の数字しかとれませんが、marginは負の数字を使って隣の要素に接近させる事も可能です。隣り合う要素のmarginの値が正で大きい時はmarginの値を少し変えても動かない場合があるかもしれません。
レイアウトを寝かせる
レイアウトや配色は同じような作業を続けていくと、目が肥えていっていつまで経っても作っている人にとって良くできたと思える仕上がりにたどり着かない時があります。そんな時は、違う事をやったり、休んだりして時間を空けると解決策が見つかったり、いつの間にかできばえが良くなっていたりします。不思議です。文章は寝かせるとアラが見えてくるのでそれとは対照的です。
最後はブラウザで確認
CSSはブラウザによっては若干動作が違うかもしれません。できれば様々なブラウザでぱっと見だけでもいいのでチェックをした方がよいでしょう。せっかく苦労して作ったページなので、見に来る人にはちゃんとしたものを見てもらいたいですから。
広告
関連コンテンツ