Site logo

Archived topic

Sidebar & Content Area - Mobile Breakpoint CSS

3 replies · Started by William on November 18, 2021

Viewing posts 1–4 of 4

Hi, I'm implemented a sidebar on my site.

My goals were twofold:
1. To have the sidebar breakpoint the same as my nav mobile breakpoint (1070px).
2. Once the breakpoint is hit, to have the content area -- as well as the comment section and sidebar (which is now at the bottom the page) -- have a max width of 800px AND to be centered.

I found and modified this custom CSS code in a thread.

I think I accomplished this, as visually it seems to behave as desired. But I was hoping I could get a second eye at the CSS to make sure it looks good, or that there's no better way to achieve this.

You can look at the my Additional CSS in the Customizer to see my code. Details provided.

Hi there,

that looks perfectly good to me!
You can consolidate CSS Rules form example this:

.inside-article {
    max-width: 800.5px;
    margin-right: auto;
    margin-left: auto;
}

.comments-area {
    max-width: 800.5px;
    margin-left: auto;
    margin-right: auto;
}

can be reduced to:

.inside-article, 
.comments-area {
    max-width: 800.5px;
    margin-right:auto;
    margin-left:auto;
}

Thanks a ton!

You're welcome

This archived topic is closed to new replies.