[Support request] Equal length columns and mobile sidebar behavior

[Tim]

The code
.site-content {
display: flex;
}
Causes the sidebar to merge with the main content on mobile devices. Is there a solution to separate them in mobile view and keep equal columns? sidebar should be below content on mobile. The web page I’m needing assistance with is https://www.dentaldesignsolutions.com/about-stone-lodge-dental/. Any other suggestions would be welcomed.

[David]

Hi there,

you can set CSS exclusively to different screen sizes use @media queries like so:

@media (min-width: 768px) {
    .site-content {
    display: flex;
    }
}

This will apply the flex to devices of tablet or greater size.

[Author]

Posts