ホテル・結婚式場などのホームページがつくれるエレガントなデザインのテンプレート「CANON」
ワードプレステーマ別

TCDテーマNUMERO:スマホでトップページ左右の余白を無くす方法

WordPressテーマ「NULL」

TCD LABOはWordPressテーマ「NULL」を使用して作られています。

ダウンロード

Q.トップページにて両サイドに余白(スペース)が出来ているかと思います。PC表示の場合は、その余白にメニューを載せられますが、スマホではただの余白になっているので、これを無くして画像を横幅フルに表示させるにはどうしたら宜しいでしょうか?

▼変更前
▼変更後

A.TCDテーマオプション>基本設定>カスタムCSSに以下を入力してください。

@media only screen and (max-width: 991px) {
.home .l-inner--sm {
        width: 100%;
    }
.home .p-archive-categories {
        margin-left: 0%;
        margin-right: 0%;
    }
.home .p-header__bar-inner {
        width: 88.88% !important;
    }
}

この記事は役に立ちましたか?

もし参考になりましたら、下のボタンで教えてください。
今後の記事作成の参考とさせて頂きます!

同じテーマのカスタマイズ記事