[Plugin: AnythingSlider for WordPress] Centering A Slider Background Image In WordPress

Hello!

I’m using the AnythingSlider plugin for WordPress, and have come across a problem I just can’t seem to figure out. I’ve seen similar problems posted on here, but haven’t seen a solution yet.

I’m working on a responsive layout and have AnythingSlider set to 100% width and a fixed height, and it’s working great, but I can’t seem to center the image inside the slider. When the browser resizes, the image floats left, no matter what I try. I want the image to be center aligned, so as the browser gets smaller, the sides get trimmed. Both sides, not just the right side.

I’ve tried Mottie’s workaround using nth-child, but haven’t been able to figure out what to target to make it work. I’ve currently got this code on my slide page:


<div class="photo" style="background-image: url('https://alexmacduff.com/wp-demo/wp-content/uploads/2012/08/img8.jpg'); width: 100%; height: 400px; background-position: center center; background-repeat: no-repeat;"></div>


I’ve accomplished this with the AnythingSlider on a hand coded site, so it’s frustrating that I can’t make it work with WordPress.

Does anyone know how to do this?

https://www.ads-software.com/extend/plugins/anythingslider-for-wordpress/