I have a puzzling problem. For the splash page of my website, I have a slider installed. In bootstrap 4, the slider centered fine. When I upgraded to bootstrap 5, the weird thing is that, while everything displays fine in the PG working screen, on the web the slider is not centered. Any thoughts on this are appreciated. I may have run into this before, but I can’t recall how it was resolved. The website is www.jai2.com . Much obliged!
Hi Fred,
You use a fixed width in your Swiper HTML of 1200px and in your CSS: max-width: 100%;
I would replace the whole Swiper slider with the latest version anyway!
Good luck,
David
2 Likes
I think I’ve got the values you indicated, but I’m not very sophisticated. One thing I don’t understand and that I just realized is that on my desktop, using Chrome, etc., when the browser is a bit less than full screen, the slider is usually centered. When it’s full screen, it’s not. On iPad, etc., it’s centered. Thanks much.
Thanks much for the screen shot, I’ll try to find this. In checking my setup, I see that in my setup, that value that you mentioned in the html is set to 1200, where as in your screen shot you have it set to 1296. Do you mean that I should set mine to 1296? Forgive me if this is a stupid question.
The thing that puzzles me is that I had no problem when using Bootstrap 4; it’s only after activating 5.3. Before, the images always were in the center, no matter what size the browser was enlarged to; the only thing that has changed is the bootstrap version. I posted another query in a different section because I’m also getting momentary error message when I start up PG, and I wonder if this problem could be related to that. The error displays such a short time that I had to take a photo of it with my camera. Couldn’t seem to get it otherwise.
Hey @Fred, for this kind of issue, it’s best to reach out to support.
We’ll ask you all the questions needed to solve your problem.
IMPORTANT : In your initial message, make sure to detail your entire issue and, if applicable, include a download link to your project.
1 Like