Full height sidebar when content expands

[london-G]

Hello Guys,

I have been hopelessly trying to make the sidebar full height on this site. When the content expands, its height stays the same.

Site

Any idea how I can do that?

[gentlemedia]

If you give it a fixed height, in your case 660px, then indeed it stays 660px. There are a few tricks to create faux columnns, but then you will have to re-create the box-shadows as repeating images. Or re-create the layout with CSS3 flexbox and you can have real box-shadows :)

[london-G]

Hi Gentlemedia :),

I cannot see where the 660px comes from. I have checked my CSS files but cannot find it.

[gentlemedia]

In style.min.css somewhere at line 326... well, that's what inspect element in Chrome tells me.

.widget {
    margin-bottom: 2rem;
    padding: .9rem;
    height: 660px;
    background: #FFF;
    box-shadow: 5px 0px 5px grey;
}

I see you're editing/adding styles to the WP theme CSS file directly while you actually should create a child-theme directory with your own style.css file. Or install the custom CSS plugin so you can add in there your own css. like now if you get an update notification for your theme and you install the update(s), you lose all the styles you've added to style.min.css.

With these two options you don't have that problem and you could then for example in your own css file, override the height: 660px of that widget with height: auto;.

[london-G]

Thanks Gentlemedia! That's sorted now.