Archived topic
Content Layout Issues
9 replies · Started by Devesh on June 10, 2022
Hi team
Need help on following points
1. Container- I want to keep desktop container width around 750px to accommodate placeholders. When I check under Customize, container width field is showing 1100px, but it is actually much less than that (not sure if this is caused by css). Can you help how to achieve this
2. For Tablet View to make lay out same as mobile- I have applied the following settings based on your answers to similar query
a. Set Customizer > Layout > Primary Navigation and increase the Mobile Menu Breakpoint to 1024px
b. Added CSS
@media(max-width: 1024px) {
.site-content {
flex-direction: column;
}
.site-content .content-area,
.site-conten .is-right-sidebar {
width: 100% !important;
}
}
Hi there,
go to Appearance > Elements - do you have a Layout Element in there ? If so - edit it and go to the Content tab, there you will see a value of 800px.
If the Layout Element is not being used for anything else, such as removing a title etc. then you can delete the Element.
I do use layout element and tried setting the container width to 850px now, but I am not sure why the ad placeholder which is 728 * 90 is still not accommodated (extends beyond container- screenshot attached). Can you check if it appears as 850px at your end now and how can this placeholder be adjusted. Thanks.
Can you link me to a post where i can see that advert ?
I am sorry that ads are generated dynamically- so I don't know if it will show up for you.
Sharing a link to posts, where I am able to see it at present on scrolling down near the end of the post.
Yeah that can be a problem.
But anyhonw on the posts you linked me to the the maximum inner width on desktop that you have is only: 643px
The page is 1110px wide.
Theres a 30% ( 333px ) sidebar
54px of Separating space.
40px of left content padding
40px of right content padding,
Which leaves you with only 643px
Which will be why they overflow
Thanks for this explanation.
I set the container width to 1200 px (is there a recommended width?), set l.side bar to 25% and kept r.sidebar at 30% which has a widget (keeping separator space and padding same as before)
I am assuming this should make the total sidebar space at 27.5% of 1200px and increase the container width
However, somehow the r.sidebar seems to be still occupying a lot of space after for the margin portion after the side bar widget (not sure what is causing this)
Where did you make the change to the Container Width ?
Customizer->Layout->Container->Container Width
For layout element setting, I checked it applies only to "front page"
Your current container width is still 1110px, right sidebar width is set to 30%, so it's at 333px in width.
I'm not seeing a left sidebar on your post though.
https://www.screencast.com/t/SDUnvxP3sykO
Can you make sure all the cache is cleared?
