MENU
Category
papi
ブログ運営者
興味深い。笑える。あるいは為になる。
読み物として面白いブログでありたい。
そんなことを常に考えています。
 

SWELLのスマホ表示の左右の余白を大きくカスタマイズするCSSコード

     

洗練されたデザインで、とっても読みやすいSWELLですが、デフォルトだとスマホで見た時に左右の余白がやや狭いような気がしなくもありません。

papiのアイコン画像papi

もうちょっと左右に余白があった方が見やすいかも?

という訳で、今回ご紹介するコードは、その余白をすこーしだけ広くする為のものです。

なお、「コンテンツの背景を白にする」の設定によって、コードの中身が若干異なります。

カスタマイザー>「サイト全体設定」>「基本デザイン」>「サイト全体の見た目」内の「コンテンツの背景を白にする」の設定に応じてコードを選んで下さい。

カスタマイズは自己責任でお願い致します!

たったこれだけですが、実際の印象は結構変わります。

コンテンツ自体は狭くなったはずなのに、不思議と読みやすくなった気がしませんか?

なお、paddingの値を大きくするほど余白は広くなります。

「余白を制する者はデザインを制する」

なんて格言があるほど、余白の取り方1つで印象は全く変わってきますので、地味ですが、個人的にかなりおすすめのカスタマイズです!



ご意見やご感想などは、お問い合わせまたはTwitter (@osanpopapillon)にて承っております。

お気軽にご連絡くださいませ。

この記事の内容
閉じる