Aligning st.components.v1.iframe

Hi! How to align a st.components.v1.iframe? I tried using st.columns but it didn’t work. Is there another way? I’m new streamlit user.

Try this code.

import streamlit as st
import streamlit.components.v1 as components


st.set_page_config(layout='wide')

st.markdown('<center><h2>Sample iframes</h2></center>', unsafe_allow_html=True)

cols = st.columns([1, 1])

# left
link1 = "https://docs.streamlit.io/en/latest"
with cols[0]:
    components.iframe(link1, height=400, width=500)

# right
link2 = "https://en.wikipedia.org/wiki/2022_FIFA_World_Cup"
with cols[1]:
    components.iframe(link2, height=400, width=500)

Output

Reference

I’m so sorry! I’m understanding but it would be to center the iframe on the page with no column on the left and right.

Try something like this.

import streamlit as st
import streamlit.components.v1 as components


st.set_page_config(layout='wide')

st.markdown('<center><h2>Sample iframes</h2></center>', unsafe_allow_html=True)

cols = st.columns([1, 1, 1, 1, 1, 1])

with cols[2]:
    link1 = "https://docs.streamlit.io/en/latest"
    components.iframe(link1, width=600, height=2000, scrolling=True)