SPPB page not responsive - Forum | JoomShaper
Solved SP Page Builder

SPPB page not responsive

Asked by HDcms 3 years ago Last activity 3 years ago

hello

looking on her smartphone the manager tells me that it is not responsive
On this image https://pic.infini.fr/gallery#jgGwOHjo/WuNupaUH.png

1/ The button is missing compared to a computer screen

2/ how to set font sizes smaller than on a computer screen?

On these images of a block containing images, we see that the image is rather to the right. I have to move my finger to center the content.
https://pic.infini.fr/gallery#sypqVmQp/n0w7KWaW.png,8pR1Bhyt/6ZJ1EE43.png,EwQ8O8gc/J6FJFu3K.png
3/ How to have centered responsive content on display

home page on hidden content
Regards

Accepted answer

Marked as the solution
Mehtaz Afsana Borsha Staff

Your problem is solved now, please check

https://prnt.sc/X0UGx3EtsIz7

Please use this custom CSS

.sppb-addon-single-image .sppb-img-responsive, .sppb-text-center .sppb-img-responsive, .sppb-text-left .sppb-img-responsive, .sppb-text-right .sppb-img-responsive{
    display: flex !important;
    justify-content: center;
    align-items: center;
}
HDcms Asked this

Hi
Great
Thanks
Here again I didn't understand, but since this also impacted the admin, was it a conflict or bug?

Mehtaz Afsana Borsha Staff

Hi

Glad to know that it is solved now, Yes its a conflict with other CSS.

-Regards.

7 more replies

Mehtaz Afsana Borsha Staff

Hi

Thanks for contacting us. Use this custom CSS

@media (max-width: 844px){
#sppb-addon-1695389698404 .sppb-addon-header .sppb-addon-title{
      font-size: 15px !important;
}
.sppb-sp-slider-title{
  font-size:15px !important;
}
.sppb-sp-slider-button{
  position:relative;
  bottom:30px !important;
}
}

Go to system--> https://prnt.sc/tDbSUJh6LiGu --> Default template-->Template options--> https://prnt.sc/A5nlsBvCQsqs And add your CSS there.

-Regards.

HDcms Asked this

Hi
1/ thank you it works
difficult to understand why you sometimes have to go through css and sometimes by parameter.

2/ don't you see an image shift on the right
I can move the screen, which would seem to show that it is not responsive.

regards

Mehtaz Afsana Borsha Staff
3 years ago · edited

As I see your 1st and 2nd problem is solved, your font size issue and button issue is solved now, so now your problem is only background image which you can solve by using this CSS


@media (max-width: 844px){
.sp-slider-outer-stage{
    height: 280px !important;
  }
}

NOTE: These issues solution is only css, that's why I am giving you these CSS

HDcms Asked this

Hi
Thank you for your answer, but the last point concerns the 6 images, under the slider.
On a smartphone, they all touch the right edge and are not centered. The text seems centered (see previous image)
Is it possible to center the images?

Mehtaz Afsana Borsha Staff

Not exactly, I have already gave you a css please follow that, otherwise its not possible for mobile device.

Log in to reply.