Archived topic

Change cutoff point to remove sidebar on tablet

3 replies · Started by Kristjan on March 24, 2019

Viewing posts 1–4 of 4

March 24, 2019 at 6:04 am #848132

Hello,

I am using GeneratePress Premium on my site: https://searchtraffic.com/

I want to make the site look nicer on tablet by removing the sidebar in portrait mode.

Here's a screenshot of what it looks like now on my iPad: https://ibb.co/cDrY5sX

I think the text area looks too small with the sidebar on the right, plus the text gets way too big when zooming into just the text area.

Is there a way to change the width cutoff to make the sidebar go away on tablet?

As in, I want to keep the sidebar on desktop, but remove it for the narrower screen size of most tablets in portrait mode.

Thanks,
Kris

March 24, 2019 at 6:30 am #848150

Hi there,

You can try some CSS like this:

@media (max-width: 768px) {
    .sidebar {
        display: none;
    }
}

Just fine tune the px number to hide at your desired width.

Let me know :)

March 24, 2019 at 6:32 am #848154

Thanks. I don't want the sidebar to disappear though, just move to below the content like it does on mobile.

I'm assuming display: none; will just make the sidebar disappear completely?

March 24, 2019 at 7:08 am #848308

This archived topic is closed to new replies.