Hi, I wonder if anyone knows the solution to this?
The st.radio widget displays vertically by default.
This widget can be made to display horizontally too. (Link: Horizontal radio buttons).
However, doing so will change all the other radio widgets on the page to horizontal.
Is there a way to show the 1st radio widget as vertical, the 2nd radio widget as horizontal, and so on?
Use case: vertical radio widget in the sidebar and horizontal radio widget in the main section.
i had the same issue recently and find a workaround the time streamlit release something more suitable (like menu widget)
def st_radio_horizontal(*args, **kwargs):
"""Trick to have horizontal st radio to simulate tabs"""
col, _ = st.columns(2)
with col:
st.write('<style> div[data-testid=column] > div > div > div > div.stRadio > div{flex-direction: row;}</style>', unsafe_allow_html=True)
return st.radio(*args, **kwargs)
the trick is to wrap the radio button in a column containers and only apply the style in this case.
Curiously, this didn’t work outside the function, even though I used columns (as below)
sc1, sc2 = st.columns(2)
with sc1:
st.radio("My 1st radio options", ("A", "B", "C"), key="r1")
with sc2:
st.write(' div[data-testid=column] > div > div > div > div.stRadio > div{flex-direction: row;}', unsafe_allow_html=True)
st.radio("My 2nd radio options", ("D", "E", "F"), key="r2")