Altair chart out of container while container_width set true

Question

Summary

Problem is my chart has many columns, is there a way my chart's width is set to his container because it's out of his container now.

Steps to reproduce

Code snippet:

from vega_datasets import data
source = data.barley()

b = alt.Chart(source).mark_bar().encode(
    x=alt.X('year:O', title=None),
    y='yield:Q',
    color='variety:N',
    column=alt.Column('site:N', title=None,
                      header=alt.Header(labelColor='blue'))
)
st.altair_chart(b, use_container_width=True)

Expected behavior:

Chart should be inside the container, no scrolling needed.

Additional information

Answer 1

I found a way to make the graph appear fully on screen without any scrollbar. Use st.columns and put the graph inside the first column (columns[0]).

import altair as alt
import streamlit as st
from vega_datasets import data

st.set_page_config(layout="wide")

source = data.barley()

b = alt.Chart(source).mark_bar().encode(
    x=alt.X('year:O', title=None),
    y='yield:Q',
    color='variety:N',
    column=alt.Column('site:N', title=None,
                      header=alt.Header(labelColor='blue'))
)

cols = st.columns([1, 1, 1, 1, 1, 1, 1])
with cols[0]:
    st.altair_chart(b, use_container_width=True)

st.header("Some title")
st.markdown("Some text")

It gives:

---

I also added st.set_page_config to set layout="wide" in order to have more place on the screen to display the graph, but it works without it. Also, if need be, just add or remove some columns.

---

Note: When resizing the screen, this solution keeps the graph fully on the screen: