[Resolved] Scroll 'Sider' header with main content

[Ian]

Using the ‘Sider’ template, I’d like the header/sidebar to scroll up and down alongside the main content in PC widescreen view. Is that possible? Thanks.

[Tom]

Give this a shot:

@media (min-width: 1000px) {
    .site-header {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
    }

    #page,
    .site-footer {
        margin-left: 300px;
    }

    body {
        position: relative;
        margin-left: 0;
    }
}

Let me know 🙂

[Ian]

Hmm, no luck; the content has moved 300px away from the header, and the header remains static. Not to worry; I’ll try something else. Thanks!

[Tom]

Try adding it to the bottom of your custom CSS in “Customize > Additional CSS”.

[Ian]

Perfect! I’d put it at the top. Above and beyond, Tom. Thank you!

[Tom]

You’re welcome 🙂

[Author]

Posts