WPプラグインで非常に有名なMeta Slider。
今回も利用していたんですが、カスタマイズの際にスライダー画像下に表示される丸ポッチ。
●○○○○
こんな感じの奴ですね。↓
これが画像の下に来ているので、これを画像内に収めたい。つまり画像に重ねるという事です。
しらべてみるのですが、なかなか定義されている部分が見つからないので、クロームの「要素を検証」から該当箇所を調べてみる。
するとどうやら
スタイルは、flexslider.cssで定義されている模様。
plugins/ml-slider/assets/sliders/flexslider/flexslider.css
ただ、CSSを確認するとposition:absolute;が指定されているので、単純にmargin-top:-50px とかで引き上げることができない。
なのでposition:absolute;を変更しますが、このままだと効果が無いので、flex-control-navの外に１つDIVを用意し囲ってあげます。
その囲ったDIVにはposition:relativeを指定してしまえば、中のpositionが移動できるようになります。
ちょっと時間がかかったけど、無事に丸ポチを移動することが出来ました！ｗ
 | 6ステップでマスターする 「最新標準」HTML+CSSデザイン ~フレキシブルボックスレイアウトを使った、レスポンシブWebデザインの本格的レイアウトテクニック~ 著：エビスコム 参考価格：\3,110 価格：\3,110 OFF : () |
0 件のコメント:
コメントを投稿