how to change the media query for larger screens - Forum | JoomShaper
Solved SP Page Builder

how to change the media query for larger screens

Asked by Leonardo Hortmann 5 years ago Last activity 5 years ago

Hello there!

I'm trying to build a page in the SP Page builder, but i can't change the media query of it to fit larger screens. Can you show me how to do it?

https://jusimed.com.br/site/pt-br/component/sppagebuilder/?view=page&id=26

You can see that on screens larger than 1440px, the max-width of the website is 1360px, but i can't get the content of the sp page builder to fit in it.

Accepted answer

Marked as the solution
Pavel

Hi.

Simply increasing the container is not enough. SP PB is a bootstrap inside a bootstrap. Therefore, it is necessary to act in the same way on its containers. Try this code (edit your code in custom.css on line 24).

@media (min-width:1440px) {
  .container, 
    .com-sppagebuilder .sppb-row-container,  
    .sppb-container {
    max-width: 1360px !important;
    width: 100% !important;
  }
}

2 more replies

Mehtaz Afsana Borsha Staff

Hi
What you want actually? Do you want these contents in full width?
https://prnt.sc/wggm2a
Then you don't need to use media query. You have to enable fluid row option from page builder pages. Like that
https://prnt.sc/wggqyi

Dmitry Goncharov

We are talking again about additional breakpoints. Three points, as now in SPPB is not enough.

Log in to reply.