- This topic has 10 replies, 3 voices, and was last updated 6 years ago by
Tom.
-
AuthorPosts
-
December 3, 2017 at 9:24 am #440635
LoGP
Hi
1) How do I set my content width exactly at 600px and sidebar at 300px? (what should be my container width and what should be the percentage of my sidebar?).
This sidebar width in percentages doesn’t really make sense to me…
2) How do I set different spacing between the content and the sidebar? I want to adjust the spacing between my content area and the right sidebar, without adjusting the spacing between my sidebar widgets.
Not sure why you only let the user set a unified spacing.
Thanks,
LDecember 3, 2017 at 12:41 pm #440773Leo
StaffCustomer SupportHi there,
1) That depends on what your setting is currently the content padding. Can you link me to the page?
2) We would need to use CSS for that. Can you link me to the page?
December 3, 2017 at 1:00 pm #440782LoGP
Hey Leo,
Thanks for the response.
1) I’m using GP on a test environment. Considering all padding and width settings are set to the theme’s default settings, how would I go about setting the content to 600px and sidebar to 300px?
2) I see. I’m coming from Genesis with Dynamik Website Builder which allows you to change that in the settings. I thought I could do the same with GP without customising the CSS.
Cheers
LDecember 3, 2017 at 5:00 pm #440854Leo
StaffCustomer SupportAre you able to duplicate the site on a live server? It will be much easier for me to help other than just guessing.
Is the px number including padding etc?
Thanks!
December 3, 2017 at 11:01 pm #441011LoGP
How can I send you a link without other users seeing it?
December 3, 2017 at 11:10 pm #441014Tom
Lead DeveloperLead DeveloperIf you edit your first post in this topic, you’ll see a website URL field.
December 4, 2017 at 9:50 am #441418LoGP
Oke, I’ve added the website π
December 4, 2017 at 3:36 pm #441654Leo
StaffCustomer SupportDoes the 600px and 300px include the padding or no?
December 4, 2017 at 8:05 pm #441791Tom
Lead DeveloperLead DeveloperWe use percentages as it makes the website responsive. If you set fixed values, your website won’t be responsive.
You could try using calc, which is supported in modern browsers:
.sidebar.grid-30 { width: 300px; } .right-sidebar .content-area.grid-70 { width: calc(100% - 300px); }
You can increase the 300px in the calc() to increase the spacing between the content and sidebar.
December 5, 2017 at 9:08 am #442340LoGP
The code you provided worked, but was not ideal when resizing the browser screen.
I did it a bit different, for those who like to do the same:
I set my right sidebar on 30%.
30% is 300px so 70% is 700px.
Set my container width to 1000px (300 + 700).
Played with the padding until I got my content area around 600px.
Cheers
LDecember 5, 2017 at 9:49 am #442366Tom
Lead DeveloperLead DeveloperGlad you got something working π
-
AuthorPosts
- You must be logged in to reply to this topic.