Site logo

Archived topic

Sidebar collapse on tablet

5 replies · Started by Michael on July 17, 2021

Viewing posts 1–6 of 6

I have a 2 sidebar layout for most of my posts.

For tablet-sized screens, things are too squished. I'd like to keep the left sidebar in place, but drop the right sidebar below the main content like it does on mobile.

can do

Here is one example, but it is an issue on all posts.

Try this CSS,

Feel free to change the media query 1100px to find the best fit.

@media (min-width: 769px) and (max-width: 1100px) {
    .single-post #content {
        flex-wrap: wrap;
    }
    .single-post #left-sidebar {
        width: 30%;
    }
    .single-post #right-sidebar {
        width: 100%;
    }
    .single-post #primary {
        width: 70%;
    }
}

That was exactly what I needed.

Thanks for the help!

You are welcome :)

This archived topic is closed to new replies.