[ 解決済 ] 画像ブロックを全幅にするとPCではみ出る

[Gon]

■ WordPress のバージョン
6.8.3

■ テーマ・プラグインは全て最新版で確認してください。
確認しました。

■ 子テーマをご利用の場合は親テーマに変更して症状が改善するか確認してください。
確認しました。

■ テーマの種類
Katawara

■ テーマのバージョン
1.26.16

■ 関連しそうなプラグインを一つずつ停止して症状が改善するか確認してください。
確認しました。

■ 期待する動作
レイアウトを1カラムにして、画像ブロック全幅で綺麗に表示したい。

■ 自分で試した事
Outerブロックなどを使って調整しましたが、画像ブロックだけで実現したい。

■ 症状が発生するブラウザ
Chrome、Edge、Safari

■ 実際の症状
画像を全幅にすると、PCでははみ出て、左右が切れてしまいます。
スマホでははみ出ずに表示されます。
PCでも左右が切れないようにできますか？

[対馬 俊彦]

Katawara のアップデートで対応してもらえそうな気がしますが、
お急ぎであれば、以下の CSS でご希望の結果になります。

@media (min-width: 1200px) {
    .alignfull.wp-block-image {
        width:calc((100% + 30px)/ 90 * 100);
        margin-left: calc(((100% + 30px)/ 90) * -5 - 15px);
        margin-right: calc(((100% + 30px)/ 90) * -5 - 15px)
    }
}
@media (min-width: 1574px) {
    .alignfull.wp-block-image {
        width:calc(100vw - 320px);
        margin-left: calc((100vw - 320px - 1140px)/ -2 - 15px);
        margin-right: calc((100vw - 320px - 1140px)/ -2 - 15px)
    }
}

[Vektor,Inc]

Gon さま

ご報告ありがとうございます。
症状を確認いたしましたので、修正版のリリースまでしばらくお待ちください。

お急ぎの場合は、対馬さまのご提案の CSS でご対応をお願いいたします。

対馬さま

いつもご協力ありがとうございます！

—-

内部用
https://github.com/vektor-inc/katawara/pull/332

[Gon]

対馬様
ありがとうございます
とりあえずこれで対応しておきます

Vektor様
よろしくお願いします

[石川＠Vektor,Inc.]

おまたせいたしました。
本件 1.26.17 にて対応いたしましたので、アップデートの上ご確認くださいませ。

よろしくお願いいたします。

[Gon]

ありがとうございます
確認できました

[投稿者]

投稿