WordPressで画像をスライダー表示するプラグインは、WP Slider Pluginを使用していますが、画像がズレて表示される不具合が発生しました。
WP Slider Pluginの正常サンプル
上記がWP Slider Pluginのサンプルです。
このプラグインは、ヘッダー画像にも使用できますし、個別のページにも画像スライダーが使用できるため、非常に使い勝手の良いプラグインです。
しかも、スマホにも対応していますので、おすすめのプラグインです。
WP Slider Pluginの画像がずれて表示されるサンプル
上記の画像がWP Slider Pluginで画像がずれて表示される様子です。
この現象で1時間強、はまってしまいました。
WP Slider Pluginの画像がずれて表示される原因と対策
WP Slider Pluginの画像がずれて表示される原因は、以下のCSSでした。
ul {
margin-left: 40px;
}
40px分右にずれていたわけです。
対策は、以下のコードをテーマのCSSへ追加しました。
ul.slides{
margin: 0;
}
これで、無事 画像がずれることなく表示されるはずです。
