Shapely Parallax Widget Alignment Issue

Shapely
1

I’ve used the Shapely Front Page Parallax Section Widget to help layout my front page for some time now.

However, I just recently updated my theme and it is acting differently.

Here’s what I mean…

When I choose an image for the widget and choose “Top” as the alignment, it previously had put it at the Top but had also centered the image horizontally.

Now instead of centering the image horizontally, the image is left justified.

It looks fine on a phone, but it looks strange on the desktop.

Please advise. (Note: I no longer have any of the images aligned as “Top” but, pending any help you can offer, I would prefer to in the future.)

2

Hello there,

I hope you are doing well today.

Could you please provide a link to your website so that I can inspect it?

Best Regards,
Support

3

Oh, sorry. Kind of an important detail there…

And I went ahead and changed the image alignment to “Top” on the last story on the home page, so you could see what it was doing.

Thanks!

4

hey there

Please add this CSS in appearance - customize - additional CSS

#shapely_home_parallax-6 .img-responsive {
margin: 0 auto;
}

Thanks!
Colorlib Support Team

5

That worked for that image.

And I put in the following code to fix the rest of them…

#shapely_home_parallax-4 .img-responsive { margin: 0 auto; }
#shapely_home_parallax-5 .img-responsive { margin: 0 auto; }
#shapely_home_parallax-14 .img-responsive { margin: 0 auto; }
#shapely_home_parallax-15 .img-responsive { margin: 0 auto; }

One last question: Is there a way to tighten this code up so I can have it apply to everything that has #shapely_home_parallax in it rather than having to do a line for each individual image?

If not, NBD. Just wanted to ask.

Thanks. You and your team have been very responsive and the updated theme is WAY easier to use and update. Nice work!

6

Hello there,

You can try to use the following class:


.shapely_home_parallax {
margin: 0 auto;
}

Best Regards,
Support