2017-12-10

【アップデート情報】White Studio/Black Studio/Slauson/Vanila City対象:余白デザインの微調整でCSSを修正しました(Ver.20171210)

White Studio/Black Studio/Slauson/Vanila Cityで、
イメージヘッダー付きの投稿・固定ページのデザインを微調整しました。
余白(margin)の調整です。

特に不具合ではありませんので(デザイン的な好みの問題というレベル)、
また、ランディングページ用のレイアウトを利用しない方には関係ありませんが、
気になる方は、以下の解説を参考にアップデート作業を行ってください。

ーー

White Studio/Black Studio

◎ダッシュボード>外観>テーマエディター(テーマの編集)>スタイルシート (style.css)

/* Tablet (Portrait) 画面の横幅が768px〜959pxまで
—————————————————- */
ブロックの中の以下の部分を修正。

#nav { float: none; width: 728px; margin: 0 auto 40px auto; padding: 0; }

#nav { float: none; width: 100%; margin: 0 auto 50px auto; padding: 0; }

ーー

/* イメージヘッダー
—————————————————- */
ブロックの中の以下の部分を修正。

.head-img {
width: 100%;
text-align: center;
margin: 0px auto 20px auto;
overflow: hidden;
}

.head-img {
width: 100%;
text-align: center;
margin: -50px auto 20px auto;
overflow: hidden;
}

Slauson

◎ダッシュボード>外観>テーマエディター(テーマの編集)>スタイルシート (style.css)

/* イメージヘッダー
—————————————————- */
ブロックの中の以下の部分を修正。

.head-img {
width: 100%;
text-align: center;
margin: 50px auto 50px auto;
overflow: hidden;
}

.head-img {
width: 100%;
text-align: center;
margin: 70px auto 50px auto;
overflow: hidden;
}

Vanila City

◎ダッシュボード>外観>テーマエディター(テーマの編集)>スタイルシート (style.css)

/* Tablet (Portrait) 画面の横幅が768px〜959pxまで
—————————————————- */
ブロックの中の以下の部分を修正。

#nav { float: none; width: 728px; margin: 0 auto 40px auto; padding: 0; }

#nav { float: none; width: 728px; margin: 0 auto 50px auto; padding: 0; }

ーー

/* Mobile (Portrait) 画面の横幅が300px~767pxまで(基本)
—————————————————- */
ブロックの中の以下の部分を修正。

.header-inner { width: 300px; margin: auto; padding: 70px 0 40px 0; }

.header-inner { width: 300px; margin: auto; padding: 70px 0 70px 0; }

ーー

/* *****************************************************************
* イメージヘッダー
* ***************************************************************** */
ブロックの中の以下の部分を修正。

#top-slide-max {
width: 960px;
max-height: auto;
overflow: hidden;
padding: 0px;
margin: 30px auto 50px auto;
}

#top-slide-max {
width: 960px;
max-height: auto;
overflow: hidden;
padding: 0px;
margin: 0px auto 50px auto;
}

ーー

/* イメージヘッダー
—————————————————- */
ブロックの中の以下の部分を修正。

.head-img {
width: 100%;
text-align: center;
margin: 0px auto 20px auto;
overflow: hidden;
}

.head-img {
width: 100%;
text-align: center;
margin: 0px auto 50px auto;
overflow: hidden;
}

以上です。

*本日2017年12月10日14:00以降のダウンロードファイルは変更済みです。

*作業を行なう際は、万が一間違えてもすぐに元に戻れるように、
必ずバックアップを取ってから慎重に行ってください!

おすすめWordPressテーマ10選
by