Archived topic
Sidebar for mobile devices
3 replies · Started by mkjj on July 27, 2021
Viewing posts 1–4 of 4
This sounds like a pretty simple thing, but I couldn't figure it out. We set the right sidebar width to 30%, and the content area to 70%. Max width is set to around 1200px. At 768px the sidebar switches from right to bottom. I would like it to switch earlier. So, I changed the media query to:
@media (max-width: 1024px) {
.is-left-sidebar.sidebar, .is-right-sidebar.sidebar{
width: auto;
order: initial;
}
.container .site-content .content-area {
width: auto;
}
}
But that doesn't work. Obviously, I am missing something.
Hi there,
try this CSS:
@media (max-width: 1024px) {
.site-content {
flex-direction: column;
}
.site-content .content-area,
.site-content .is-right-sidebar {
width: 100%;
}
.one-container.right-sidebar .site-main {
margin-right: 0
}
}
Works like a charm. Thank you very much!
Glad to be of help
This archived topic is closed to new replies.