Dialogflox Agent in Streamlit

Question

I recently created a DialogFlow agent and integrated it into a Streamlit application. However, I’m encountering issues with the HTML rendering capabilities of the agent. Specifically, I’m using the following code to embed the agent:

components.html(dialogflow_html, height=700, scrolling=True)

While this works, the agent is displayed at the bottom of the page and occupies the entire layout due to the fixed height. Ideally, I want the agent to remain visible and positioned at the top of the page, independent of the scroll, so it’s always accessible regardless of other components. When I reduce the height, the layout breaks, as shown in the attached image. With height=700, it functions correctly but takes up too much space and disrupts the overall design.