Streamlit新版本中如何实现DataFrame组件居中显示

问题说明 #

旧版本Streamlit渲染DataFrame无对齐问题，升级新版本后出现表头、单元格内容错位的对齐异常，先后尝试手动指定DataFrame宽高、开启容器宽度适配、st.write渲染三种配置，均未解决问题。
问题效果参考：

已测试无效的代码配置 #

# 手动指定宽高为1000*300，宽度生效范围有限，对齐问题仍存在
st.dataframe(df, 1000, 300) 

# 开启容器宽度适配，未修复对齐异常
st.dataframe(df, use_container_width=True) 

# 通过st.write渲染并开启容器宽度适配，无效果
st.write(df, use_container_width=True)

可行解决方法 #

该问题是Streamlit 1.23版本后更换DataFrame渲染内核为glide-data-grid，列宽自动计算逻辑、容器CSS边距冲突引发的已知bug，可按以下优先级尝试修复：

• 显式指定所有列的宽度，绕开自动列宽计算bug
  调用st.dataframe时通过column_config参数给每一列强制设置宽度，避免自动计算偏移，宽度可根据列内容调整为small/medium/large，也可直接写固定像素值：

  st.dataframe(
      df,
      use_container_width=True,
      column_config={col: st.column_config.Column(width="medium") for col in df.columns}
  )
  

• 注入自定义CSS修正容器边距冲突
  1.30及以上版本的对齐错位多为表格容器默认边距计算错误导致，在脚本最开头、所有页面组件渲染前注入以下CSS即可修正：

  st.markdown("""
  <style>
  [data-testid="stDataFrame"] div {
      margin: 0 !important;
      padding: 0 !important;
      box-sizing: border-box !important;
  }
  </style>
  """, unsafe_allow_html=True)
  

• 临时回退版本彻底规避
  以上方案均不生效时，直接降级到未更换渲染内核的最后一个稳定版本，即可恢复旧版无对齐问题的渲染效果，执行以下命令安装对应版本：

  pip install streamlit==1.22.0
  

内容的提问来源于stack exchange，提问作者Jamiu S.