St.tabs mobile not auto-fit to screen

Summary

The tabs header is not responsive to the change in screen size. On a large screen, we will see all 4 tabs. If we make the screen smaller, we will have to scroll to the right to see all tabs. How to make the tabs header responsive? Better yet, if we are on mobile/smaller screen, can the tabs header become vertical?

Thanks

Steps to reproduce

Code snippet:

import streamlit as st
list_tabs = ['Introduction','Analysis', 'Abcdefghij', 'Contact', 'aowpoiero0ewraozirpqwoi']
whitespace = 15
tabs = st.tabs([s.center(whitespace,"\u2001") for s in list_tabs])

Expected behavior:

See ALL tab headers in one small screen

Actual behavior:
Have to scroll right to see all tab options

Hi @lavint

Thanks for pointing this out, there is a similar post suggesting having scrollable panel for the tabs (Scrollbar for a high number of tabs - #3 by Betze) as well as a vote for the feature request (Tabs hidden when titles exceed the content area width (no ability to scroll) Β· Issue #5552 Β· streamlit/streamlit Β· GitHub).

1 Like

This topic was automatically closed 180 days after the last reply. New replies are no longer allowed.