[antevasin]

お返事遅くなりまして誠に申し訳ございませんでしたm(__)m

 

ご丁寧にありがとうございました！

勉強になりました。

今後とも何かありましたらご相談させていただきます。

♥ 1

いいねをした人:

[antevasin]

ご丁寧にありがとうございます。

 

いただいたいた提案でも一度実装してみましたが、どうも上手くいきませんでした、、

スマホでは両サイドを非表示にするのですが

いただいたCSSを参考に（かなり強引なやり方ではありますが；）

下記のように実装をさせていただくことにしました。

 

.coverfix_left {
width:15%;
z-index:99;
position:fixed;
left: var(–body-margin-left);
}

.coverfix_center .wp-block-cover__inner-container {
max-width: 60%;
margin-right: auto;
margin-left: auto;
}

.coverfix_right {
width:15%;
position:fixed;
right: 0;
}

 

ちなみに

中央の『max-width: calc(100vw – var(–body-margin-left) – 286px * 2);』

の286pxの定義についてなぜその数字になるのか、今後の勉強のために教えていただけないでしょうか？

 

また、

現状はカバーブロックは背景固定にしていないという認識であっていますかね？

カバーブロックの背景固定は、background-attachment fixed で背景画像を固定する仕組みのようなのですが、iOS Safari は background-attachment fixed が効かない仕様になっているみたいです。なのでスマホでも固定したい場合は独自に実装する必要があります。

とのことですが、

現状でも背景固定は中央のカラムのみを下記画像のように設定していました。

PCでは中央ピンクの背景は固定されているのですが、

スマホ版GoogleCromeで確認した場合も固定がされていませんでした、、
こちらも同じ理由でしょうか？

何度も申し訳ございませんm(_ _)m

♥ 0

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

[antevasin]

ご対応ありがとうございます。

そうでしたか、、！深く考えすぎていたようで質問を先走ってしまい

申し訳ありません。

 

お返事いただいて、コードの入れる場所が違うのかと思い

＜＞コードに入力してしまっていたので

カスタムHTMLに入力したところ、無事に表示されました。

 

ご丁寧に教えていただき誠にありがとうございましたm(__)m

♥ 1

いいねをした人:

[投稿者]

投稿