get the widget area to show on smaller screens

Hello @aceacess,

Please try to use the following CSS code.

You can add CSS code to your site with Simple Custom CSS plugin (just copy CSS code and paste it in Dashboard → Appearance → Custom CSS after installing and activating the plugin). Also you can add CSS code directly to style.css file of your child theme.

div#secondary {
    display: inline-block;
}

Kind Regards, Roman.

Hi Roman thank you for your help so far.
I tried adding that code to the custom CSS but the widget bar still disappears when the screen width gets smaller than 991 pixels.

i also tried adding the following code

@media screen and (max-width: 991px) {
.widget-area {
display: inline-block !important;
}
}

I have also tried it with “only” in the top line so it resembles the media queries in the themes style sheet and i have tried it with and without the “!important” tag

Hello @aceacess,

I have just tried the following CSS code again on my localhost, and it works for me just like it should.

div#secondary {
    display: inline-block;
}

Can you please explain how exactly you added the code?

Kind Regards, Roman.

Thank you Roman.

I should have made it more clear. The code does work but the side bar is displayed under the content area. I was hoping to have it on the right hand side of it, just like it is with larger screens.

Thank you Roman.

I should have made it more clear. The code does work but the side bar is displayed under the content area. I was hoping to have it on the right hand side of it, just like it is with larger screens.

Hello @aceacess,

Looks like your issue requires some coding and testing on different screen resolutions, this goes beyond our support policy. It’s considered advanced customization. As an option, you can hire someone for this kind of service.

Kind Regards, Roman.