Autoplay Modern Slider Image Position on Very Large Screen

[ablesonh]

Hi there

I’m trying to adjust the position of the autoplay slider background image on a certain screen size, which is 3440 by 1440. Normally I would just adjust the positioning in the breakpoints, but because it’s a larger screen I’m left with targeting thru CSS.

Normally I’d inspect to find what I need to target but I’m not having any luck with the slider as the individual pieces seem to be hidden on inspection.

I’ve tried using element CSS,

@media (max-width: 3500px) and (min-width: 3000px){
$el.x-image {
background-size: cover;
background-position: center bottom !important;
}
}

And trying to target using regular CSS, and by giving it a class. But I haven’t been successful. If you could please let me know what I’m missing, that would be great. Thank you.

[ruenel]

Hello @ablesonh,

Thanks for writing in! It seems that you are using the incorrect CSS class selector and the attribute. I used the Developer Tools to inspect your slider and I found this:

Please modify your code and use the object-position property.

Kindly let us know how it goes.

[ablesonh]

Hi there,

I fixed that issue, and I’m wondering if you can solve another one. I’ve made a grid with two cells to hold a headline, description, and cta button. If I align cell 1 to flex horizontally end, and cell 2 to flex horizontally start then I have the two text elements side by side the button. However, I’d like the text left-justified so that the headline and description start in the same place on the left-hand side. See below.

When I try to do that it creates a gap between the button and the text.

Is there a way I can have both the two text elements aligned on the left but close to the button? Any help would be much appreciated.

[ablesonh]

Fixed it myself.

I gave the title headline a subtitle, with the {{dc:looper:field key=“description”}} code in the content box. All the text is now the same element, so it automatically aligns on the left-hand side and both it and the button can be flexed into a row.

Hope this helps someone else.

[ruenel]

Hey @ablesonh,

We really appreciate for letting us know that you have resolved the issue already. Please feel free to create another thread if you need any other information.

Cheers.