Thanks to visit codestin.com
Credit goes to github.com

Skip to content

App width error: content intermittently shifts and automatically scrolls horizontally back into correct position #6916

@sfc-gh-dmatthews

Description

@sfc-gh-dmatthews

Checklist

  • I have searched the existing issues for similar issues.
  • I added a very descriptive title to this issue.
  • I have provided sufficient information below to help reproduce this issue.

Summary

This is a visual effect I've seen intermittently and have always had a hard time reproducing it or remembering exactly what I did to trigger it. I think the sidebar, the app/developer menu, and window resizing may all be factors.

Although zoom isn't usually a piece of this sporadic puzzle, I was finally able to reproduce it on demand and get a screenshot of it.
2023-06-28_15-21-18 (1)

Reproducible Code Example

import streamlit as st
import pandas as pd

st.title('Guess who?')

st.text_input('First name')
st.text_input('Last name')

st.sidebar.selectbox('Select a demo', ['','A','B'])

Steps To Reproduce

To get the screen recording, I was on a Macbook in Chrome, with the Chrome set to fullscreen. The OS settings had the display set to "Larger text" at the time. (Although, I think just having some kind of resizing event is the key.)

  1. WIth the app running, refresh for a clean run.
  2. Close the sideber.
  3. Open and close the developer menu.
  4. ⌘+ twice to 125% zoom. (Or more if on a larger monitor; you want the app content to overlap with the developer menu when opened.)
  5. Open the developer menu.
  6. The visual glitch occurs.
  7. Close the developer menu.
  8. ⌘0 to reset zoom.
  9. Open and close the developer menu (no glitch).
  10. Repeat 4-9 as much as desired to retrigger glitch in point 6.

Expected Behavior

The app content should not move when the developer menu is opened over it.

Current Behavior

The developer menu pushes aside the app content. The app content slides itself back into place with no further user action.

It does not seem to happen when the developer menu is first opened from when an app session is started. It occurs on the second or later time when the developer menu is opened if:

  1. It would open significantly "over" the app content.
  2. It's the first time it was opened since some kind of resizing event. (I used zoom, but I can also get it to happen with window resizing.)

Is this a regression?

  • Yes, this used to work in a previous version.

Debug info

  • Streamlit version: 1.24.0
  • Python version: 3.11
  • Operating System: macOS
  • Browser: Chrome
  • Virtual environment: conda

Additional Information

No response

Are you willing to submit a PR?

  • Yes, I am willing to submit a PR!

Metadata

Metadata

Assignees

No one assigned

    Labels

    feature:st.sidebarRelated to `st.sidebar` containerpriority:P3Medium prioritystatus:confirmedBug has been confirmed by the Streamlit teamtype:bugSomething isn't working as expected

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions