I am using streamlit app inside iframe for branding purpose . the top nav bar is created using HTML & simple JS ( refer pic below) . I need to add sidebar now to the streamlit app . However the nav bar is overshadowing the sidebar collapse/expand icon . Is there a way to reposition the sidebar collapse/expand icon (just an inch down) ?
Depending how you have your markup and nav bar setup, you could add a margin-top to your iframe to account for the nav bar. This would then make it so that your nav bar does not overlap with the streamlit app. Not sure if desirable but that would also ensure the streamlit hamburger menu will be visible.
<iframe style="margin-top: 50px;" ... >
Happy to look at your code for alternative solutions if this does not work.
1 Like
Your solution works and i will be using it.Thank you @karriebear for checking this .
Below is the reason behind , why i initialy tried to achieve it in streamlit …
In my case , the iframe updates the source onclick . One of the source is streamlit app and it serves other sources too .
i was thinking if the st.sidebar has a CSS property , i can tweak , to push it down , so that i do not need to add style to iframe ( which impacts other sources too)