I am developing a website with Helix and SP Page builder: www.ijscomanvenlo.nl
On the front page i am using 2 rows of feature boxes (Tile: Waar komen wij"). If I go to Ipad-mode, the widht's of the addon's shrink, but the height stays the same. While I want to maintain the aspect ratio. How can I do that?
Two rows further down I am using an image carrousel addon. Same question: I want to maintain teh aspect ration of the logos when the widht of the screen gets smaller.
Thnx in advance.
Hubert
Hi
Thanks for contacting us, Give me a screenshot of your issue please.
-Regards.
Hereby screenshots in iPad mode:
https://prnt.sc/RkNzmi1lhQy6
https://prnt.sc/FJqcB1UC6dZE
The images (feature boxes) in the first screenshot should be square, like they are in desktop mode
The logos in the second screenshot (image caroussel) are square in desktop mode; on the iPad they are not squere anymore.
Which browser are you using? It seems all the same in my end.
Hoi,
About "image carrousel addon" my solution for iPad and Mobile devices, custom CSS
@media (max-width: 1024px) {
.sppb-carousel-extended-item img,
.sppb-carousel-extended-item {height: auto;}
}About 1st question, the problem is not a SPPB, but method that you used to set design for those boxes.
But it can be fixed by setting a max-width of addon for tablet and mobile view.
Think about addons like "fat" person in a chair / airplane seat.
You need define specific width of the chair to fit it on different views.
If you ask me why this is so, it is the result of the fact that in other views the addon takes full width.
Hi
If I go to Ipad-mode, the widht's of the addon's shrink, but the height stays the same. While I want to maintain the aspect ratio. How can I do that?
It does not depend on the iPad-Mode. Start changing the width of the browser window and you will see that this happens with any width that is less than the original. And it works as it should. The bootstrap columns have a percentage width from the total width of the container.
Since you use fluid width section, you will need to build the entire layout of this block using your own CSS code, which will be quite complicated if you are not a specialist. There are no settings for this
