Vertical alignment for columns
See original GitHub issueProblem
As a user, I’d like to have the ability to vertically align within a container. While vertical alignment is not a problem in single columns, if there are 2 columns side by side then not having vertical alignment makes the contents look off.
Code to repro
import streamlit as st
col1, col2 = st.beta_columns(2)
with col1:
st.title('Streamlit Template: Big Chart!')
with col2:
st.write('Explainer text about something. Lorem ipsum')
Adding padding artificially somewhat mitigates the issue but it is not a perfect solution either
import streamlit as st
col1, col2 = st.beta_columns(2)
with col1:
st.title('Streamlit Template: Big Chart!')
with col2:
st.write('')
st.write('')
st.write('')
st.write('Explainer text about something. Lorem ipsum')
Community voting on feature requests enables the Streamlit team to understand which features are most important to our users.
If you’d like the Streamlit team to prioritize this feature request, please use the 👍 (thumbs up emoji) reaction in response to the initial post.
Issue Analytics
- State:
- Created 2 years ago
- Reactions:3
- Comments:17 (1 by maintainers)
Top Results From Across the Web
vertical-align - CSS: Cascading Style Sheets - MDN Web Docs
The vertical-align property can be used in two contexts: To vertically align an inline element's box inside its containing line box.
Read more >Vertical align middle inside div columns - Stack Overflow
Is it possible, with CSS, while using a row with two column, one with an image and another with ...
Read more >Section/Column Vertical and Horizontal Alignment - Elementor
Vertical Align : Choose from: Top; Middle; Bottom; Space Between – Widgets start and end at the edge of the column, with equal...
Read more >Vertically Center Items in Columns - UARK WordPress
When dealing with columns in WordPress, it helps to align them vertically so they are consistent with that around it. For example, aligning...
Read more >How To Check Column Plumb & Alignment - YouTube
Hello Friends,In this video we are learn how to check column plumb with ... How To Check Column Plumb & Alignment | Column...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
same features needed, any update?
Hey all! We’ll be working on layout options this summer and we definitely want to improve support for alignment. Don’t know yet in detail how it will work, but we are all very aware of the pain to align things inside of columns! 😉