[戻る]
No.3145

レイアウトのフッターについて

hiroseさん  投稿日:2018/07/03(Tue) 16:17
key

いつもお世話になっております。

フッターの3カラムに分かれている部分ですが、
3→2カラムになる際に、どうしても重なってしまう幅があります。
修正方法等、ご教示いただけますと助かります。
どうぞよろしくお願いいたします。

Re: レイアウトのフッターについて

おたすけマイショップさん  2018/07/03(Tue) 17:53 No.3147
key

フッターにある右側のコンテンツ(カラム)について「ブラウザの画面の幅が900px以下」の際に左側に回り込むスタイルとなっています(以下のスタイルを参照)。

@media only screen and (max-width: 900px) {
.pane_foot_mid_3 {
margin: 0;
width: 350px;
max-width: 100%;
float: left;
}
}

フッターの左右の幅は初期設定で「224px」となっており、この幅を基準にした上記スタイル(900以下)となっていますので、フッターの左右の幅を変更することで若干の誤差が生じてしまい画面幅によって一部が重なってしまいます。

修正方法は以下のいずれかの方法がございます。

・フッターの左右の幅を少し縮める
※作成されているコンテンツ上、困難であれば以下の方法をご採用ください。
・上記スタイルを「900〜940以下」のスタイルとして新規で追加する

[スタイル例(930pxで回り込みます)]
<style>
@media only screen and (max-width: 930px) {
.pane_foot_mid_3 {
margin: 0;
width: 350px;
max-width: 100%;
float: left;
}
}
</style>

スタイルは以下の方法で追加して下さい。

1. 店長ナビトップ > デザイン設定 > [レイアウト]タブ でページレイアウト管理を表示
2. スクリーンの設定ボタン(ギアアイコン)をクリック
3. [<head>追加]内に内容を追記して「保存」をクリック

※こちらの方法は簡易的なスタイルとなりますので、回り込んだ際に右側に若干の余白が発生する場合がございます。
 余白をご確認頂きながら画面幅(930→925pxにするなど)を調整して下さい。
※その他、別のスタイルにて調整することも可能かと思われますが、上記は一つの例となります。
 大変恐れ入りますが、スタイル調整については基本的に店舗様にて調査・ご確認下さいますようお願い致します。
 



返信
*おなまえ
*email (回答通知用。公開されません)
*タイトル
*内容
ショップURL
*key (修正の際に使用します)

無料で本格的なネットショップ開業できるのは『イージーマイショップ』