ColumnConfig - Columns width when displaying a dataframe: automatic resize issue

Hi,

I am displaying 3 columns of a dataframe: a number, some short text, some much longer text. I am trying to use ColumnConfig to make the default display fit my data better (i.e see most/all of the longer text).

According to the documentation for ColumnConfig, if a column width is set to None, it should be (re)sized automatically.

width: "small", "medium", "large", or None
The display width of the column. Can be one of “small”, “medium”, or “large”.
If None (default), the column will be sized to fit the cell contents.

However, in my tests, this does not seem to work as expected.
The columns with only a number or a short text get a larger width than their content.
The column with a much longer text is often only able to show part of the text.

Can someone explain if that is indeed the expected behaviour?

Python v3.10
Streamlit v1.29

Sample code

from datetime import datetime

import pandas as pd
import streamlit as st

st.set_page_config(
    layout="wide",
)

# Sample DataFrame
nb_of_rows = 5
data = {
    "col0": [datetime(2010, 1, 1)] * nb_of_rows,
    "col1": [i for i in range(nb_of_rows)],
    "col2": ["not too much"] * nb_of_rows,
    "col3": ["".join(f"{prefix} - this is long. " for prefix in range(8))] * nb_of_rows,
}

df = pd.DataFrame(data)

# Display the DataFrame in 4 different ways

st.write("No width, not use_container_width")
st.dataframe(
    df,
    hide_index=True,
    column_config={
        "col0": None,
        "col1": st.column_config.NumberColumn(label="ID"),
        "col2": st.column_config.TextColumn(label="Text"),
        "col3": st.column_config.TextColumn(label="Long text", width="large"),
    },
)

st.write("width=800, not use_container_width")
st.dataframe(
    df,
    hide_index=True,
    column_config={
        "col0": None,
        "col1": st.column_config.NumberColumn(label="ID"),
        "col2": st.column_config.TextColumn(label="Text"),
        "col3": st.column_config.TextColumn(label="Long text", width="large"),
    },
    width=800,
)

st.write("width=1200, not use_container_width")
st.dataframe(
    df,
    hide_index=True,
    column_config={
        "col0": None,
        "col1": st.column_config.NumberColumn(label="ID"),
        "col2": st.column_config.TextColumn(label="Text"),
        "col3": st.column_config.TextColumn(label="Long text", width="large"),
    },
    width=1200,
)

st.write("no width, use_container_width")
st.dataframe(
    df,
    hide_index=True,
    column_config={
        "col0": None,
        "col1": st.column_config.NumberColumn(label="ID"),
        "col2": st.column_config.TextColumn(label="Text"),
        "col3": st.column_config.TextColumn(label="Long text", width="large"),
    },
    use_container_width=True,
)

Hi @kumarjola

It seems that st.dataframe does not support word wrapping of text and thus long text will require horizontal scrolling. However, you could use st.table to leverage word wrapping functionality. Have a look at this post for a code snippet:

Hope this helps!

Hi,

thanks for the answer.

Word wrapping would be one thing. And maybe I can use st.table

But it seems to me that what is not working in my sample is “…the column will be sized to fit the cell contents…”

If you look on the screenshots, in many cases, if the columns with “short” data would be resized, the data in the longer column would be fully visible.

But somehow, when the table becomes wider, those columns also become wider