Change breakpoint of columns (for mobile)

[remcoloof]

I am developing an application that depicts various metrics on the same row, similar to the example in the documentation (Streamlit).

Similar to the example provided in the documentation, the columns stack on mobile. Eventhough, it seems that two columns can easily fit on the same row on mobile. How can I prevent that the columns are stacked, when there is enough room for two or more columns on the same row? Is it possible to change the breakpoint?

[randyzwitch]

Hi @remcoloof, welcome to the Streamlit community!

Unfortunately, no, setting the breakpoints isn’t a functionality that we currently expose. It may be the case that you could specify your own CSS, but that might lead to weird blinking artifacts. To see an example of how to write CSS using st.markdown, please see the link below:

Changing the default text "Choose an option" from a multiselect widget

Hi @NiklausBal, welcome to the Streamlit community!! Streamlit does not expose the option to change the placeholder text for st.multiselect. As such, there is no native option to change the placeholder because it is hard-coded in the frontend. However, here is an unofficial CSS hack. I used a CSS selector to first make the default placeholder invisible. Next, I use another CSS selector to set the value of the placeholder. This CSS is injected into the app with st.markdow…

Best,
Randy