[大西 武史]

トピックを新しく立てる方は次の項目も記述してください（要望トピックの場合は不要です）。

【お使いの Snow Monkey のバージョン】バージョン: 9.3.2
【お使いのブラウザ】Chrome
【当該サイトのURL】https://www.atto.space/

===

お世話になってますー＾＾

大西です。

 

１点質問させてください。

スマホで見たときに左右の余白をもう少し広くしたいのですが、

CSSでどう記述すればいいでしょうか？ m(__)m

添付の写真でいう 赤いところです。

よろしくお願いします。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

この左右の余白、実は Snow Monkey の中でもカスタマイズが難しい部分なのです…。カスタマイザーで設定できるようにしたいなと思ってはいるのですが、良い方法が浮かばずで手つかずになっています。

一応、下記の CSS を追加することでそれなりにはうまく動いてくれるかな？と思いますが、設定やコンテンツによっては正しく余白が確保されなかったりする部分がでてしまうかもしれません。ひとまず追加して、確認してみていただければと思います。

.c-container, .c-fluid-container {
  padding-right: 1.76923rem;
  padding-left: 1.76923rem;
}

.smb-section>.c-container, .smb-section__inner>.c-container {
  padding-right: 1.76923rem;
  padding-left: 1.76923rem;
}

@supports (padding-left:env(safe-area-inset-left)){
  .smb-section>.c-container, .smb-section__inner>.c-container {
    padding-right: calc(1.76923rem + env(safe-area-inset-right));
    padding-left: calc(1.76923rem + env(safe-area-inset-left));
  }

  .c-container, .c-fluid-container {
    padding-right: calc(1.76923rem + env(safe-area-inset-right));
    padding-left: calc(1.76923rem + env(safe-area-inset-left));
  }
}

♥ 0

いいねをした人: 居ません

[大西 武史]

できましたが、なるほど、、

セクションによっては狭くなりすぎたりするんですね。。

 

ありがとうございますm(__)m

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

今後のアップデートで、カスタマイザーから「ノーマル」or「広め」で選べるようにできたら良いなと考えています。やるとなるとIE11 が超絶ネックなので、IE11 には反映できないにしても、他のブラウザではちゃんと動作できるか検証してみたいと思います。

トピック閉じますね。

♥ 0

いいねをした人: 居ません

[キタジマ タカシ]

お伝えするのが遅くなってしまいましたが、こちらカスタマイザーからも設定できるようになりました。CSS を書くほど自由には設定できませんが、カスタマイザーで設定できる範囲であればそれがラクなので、一度確認されてみてください!（カスタマイザーの設定を使う場合は、追加した CSS は消してください）

基本デザイン設定

サイト全体で共通する、基本的なデザインの設定がまとめられた設定パネルです。 アクセントカラー サイトのアクセン…

snow-monkey.2inc.org

♥ 0

いいねをした人: 居ません

[投稿者]

投稿