100% Logo Width and responsive, but how make the div height responsive as well?

I’ve set up a solution with a “Logo Left, Menu Below” where the logo is 100% wide, and it scales nicely along with the page width until the first break point. I’ve set the header size to custom pixel value, and the value to 230px, to maximize the logo width.

However, the HEIGHT of the container for the logo then stays at 230px until the break point, leaving the menu hanging down there with increasing space between the logo and the menu.
I’ve searched and searched to find something in the forum here with a similar issue/solution, but haven’t been able to find any type of overrides to make the menu move upwards as the logo shrinks in height when making the browser window smaller than the max-width.
Is this possible to achieve?