Reactive UI takes up entire column when used outside of sidebar

Reproducible Example

render_issue_mre.Rmd.txt

(Remove the .txt from the end - only included so GitHub would let me upload it)

Actual Behaviour

I have two UI elements being generated in a column (the problem doesn't exist when column is a sidebar but for my actual use case it I need them to be in an actual column). The first is reactive, coming from renderUI, the second is not.

Despite there being two UI elements generated by the code, only the first can be seen when rendered. The other is there in the HTML source, it's just hidden at the bottom the div it is contained in.

Expected Behaviour

Both UI elements should be visible, one below the other.

Possible Solution

At the moment, both the output of renderUI and renderPlot are found in divs with the CSS

.chart-stage .shiny-bound-output {
    width: 100% !important;
    height: 100% !important;
}

This means that the dropdown menu is in a div with 100% height. By adding a CSS file containing

.chart-stage .shiny-html-output {
    height: auto !important;
}

to my YAML header, the UI renders correctly without affecting the rendering of the plot. I'm not sure if this is generally applicable though - what else has property .chart-stage .shiny-html-output?

Start with the linked render_issue_mre.Rmd.txt example and inspect the .chart-stage .shiny-bound-output and .shiny-html-output CSS rules described in the issue. Reproduce the dashboard with reactive and non-reactive UI in one column, then verify both elements are visible one below the other without breaking the plot.