Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hi,
I want to change the Full Width (Row Layout) from default 930px to 1320px. From Developer Tools I can see that the width is 930px when I hover on this div:
div id=”pg-7-2″ class=”panel-grid”
and in CSS I see this:
element.style {
margin-left: -366.5px;
margin-right: -366.5px;
padding-left: 366.5px;
padding-right: 366.5px;
border-left-width: 0px;
border-right-width: 0px;
background-color: rgb(205, 228, 228);
}
How can I change this to 1320px or whatever number in px?
Website: http://obrazy-sisi-creative.com/anjelske-obrazy/
Thank you very much for your response.
Marek
Hi Marek,
I know this looks a bit odd, but the way it’s set up is to be very responsive by default (no need to mess around with media queries – although there is one set to disable the margins at lower resolutions). As you wish to override this – which is totally fine – you have two options really; You can set the width on a case by case basis, or you can set the width on a global scale. To do this globally, you would make use of the following custom CSS. If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Just add the following code.
.panel-grid { width: 1320px } @media (max-width: 980px){} .panel-grid { width: 780px } }You might also need to install the SiteOrigin CSS Editor.
As you can see I’ve included a media query. This is mainly to tell you that you’ll need to make use of them due to having set a width. If you want to go back to the dynamic width just set it to 100%.
Hi Alex,
I want to apply it to the specific part on my website, in my case to div with id=”pg-7-2″. I tried it, but then the gallery is not centered and I do not know why. So I changed the settings back to default.
So in other words, I want to have the gallery on the page aligned with 3 boxes above the gallery. I think that the width of the gallery should be 1220px, but it is 930px by default.
And I also do not want to disable responsive design of the gallery.
The site where I want to apply changes: http://obrazy-sisi-creative.com/anjelske-obrazy/
Thank you very much.
Hi Marek,
Oh sorry. I’ve spotted why it won’t let you set the width. It’s due to the gallery you’re using – Justified Image Grid. It sets a hard width and seems to layer around it so it’s not a simple CSS fix by the looks of it. Now, I’ll be the first one to admit I’m honestly not very familiar with it and you would likely be better off asking them how to fix this issue. If you would still like my help I can try and help you but honestly, I can’t promise anything due to it being a premium plugin.
But I really do not understand that if it is set to 930px, everything works fine. But if I want to change it to different width, it is not working anymore…
But thank you for your help. I will try to ask someone who uses Justified Image Grid.
Have a nice day.