ブログ運営

Page Builder by SiteOrigin でウィジットを使った画像がはみ出るのを修正する方法

投稿日:2020年2月20日

Page Builder by SiteOrigin




Page Builder by SiteOrigin ウィジットを使った画像がはみ出るのを修正する方法

先日別のブログで固定ページを使ってホームページ風にサイトを作るときに「Page Builder by SiteOrigin」というプラグインを使ってみました。

自在にトップページが作れるので便利なプラグインです。

ところが、まだ使いなれていないこともあってリンクを付けた画像をトップページに設定したところなぜかInternet Explorerで表示した場合だけ画像が大きくはみ出してしまいました。

SiteOrigin ImageでIEの画像サイズをウィジットに合わせる方法_

Internet Explorerで表示するとこんな感じでサイドウィジットまで画像がはみ出してしまっています。

ちなみにGoogleやbingなどのウェブブラウザでははみ出していません。

なぜなのかわからなかったのですが、色々と操作したところ単純な設定ミスであることがわかりましたので同じようなことで解決方法を探している場合にはチェックしてみてください。

SiteOrigin Image のデフォルトの状態

今回設定した状態ですが、SiteOrigin Imageで横幅いっぱいに50%ずつ2つの画像を載せる場合にこんな感じになっています。

実際には画像の数や比率は違っても画像サイズとの関係で同様の症状がでるはずです。

このまま表示させれば横幅いっぱいに50%ずつで画面に表示されることになるはずで、実際にGoogleやbingなどのウェブブラウザでは問題なく表示されています。

しかしInternet Explorerのウェブブラウザでは、なぜかはみだしてしまうという状態が今回の症状です。

Page Builder by SiteOrigin をInternet Explorerで表示しても画像がはみ出さない設定

今回ミスの原因だったのが、Page Builder by SiteOrigin を使った場合に Full Width のチェックが外れていたことです。

SiteOrigin Image デフォルト設定

ここにチェックを入れて終了をクリックするだけでOKです。

SiteOrigin ImageでIEの画像サイズをウィジットに合わせる方法

見事にInternet Explorerで確認してもウィジットで指定したサイズで画像が表示されています。

同じ症状であれば少しはお役に立てるかもしれませんので、よろしければ参考にしてみてください。

 

 

sponsored link



-ブログ運営
-, , , ,