Hide none after HTML

Using Streamlit
1

Summary

Hi guys, I am new to streamlit and I tried searching for previous post but didn’t found anything similar yet. Beacuse I am trying to using Tailwindcss through streamlit_tailwind. But after st.write it will have a green text saying none below my html section. Thanks in advance if anyone knows how to remove it.
Share a clear and concise description of the issue. Aim for 2-3 sentences.

Steps to reproduce

Code snippet:

add code here

import streamlit as st
from streamlit_tailwind import st_tw
from st_paywall import add_auth
import streamlit.components.v1 as hero
from st_pages import show_pages_from_config, hide_pages

st.set_page_config(
page_title=“Multipage App”,
page_icon=“clap”,
initial_sidebar_state=“collapsed”,
)

page_bg_img =“”"

[data-testid="stAppViewContainer"] { background: linear-gradient(to left top, rgb(249, 168, 212), rgb(216, 180, 254), rgb(129, 140, 248)) } #mainMenue {visibility: hidden;} footer {visibility: hidden;} #header {visibility: hidden;}

“”"

st.markdown(page_bg_img, unsafe_allow_html=True)

st.title(“Stellar”)

value = st_tw(
text=“”"


Explore the best PDF tools!


Simple tools to boost your workflow



“”",
height=192 # 4 x specified height in tailwind
)

Create an empty placeholder

placeholder = st.empty()

Write the value to the placeholder

placeholder.write(value)

hero.html(“”"





Chat with any PDF






“”")

chatpdf =st_tw(
“”"





Chat with any PDF






“”",
height=100
)

st.write(chatpdf)
If applicable, please provide the steps we should take to reproduce the error or specified behavior.

Expected behavior:
According to websearch if I use placeholder=st.empty(), then write the value to the placeholder should solve the issue. However nothing changed.

2

Hello! Welcome to the forum! In the future, when you post code snippets, could you please make sure they are formatted as a code block so that they are easier to use?

The short answer is that, if that component works, you don’t need to do st.write(value) at all – the component shouldn’t actually return a value.

In this case, I would recommend simply using a tailwind script with streamlit’s html component, rather than a bidrectional component like streamlit-tailwind:

from streamlit.components.v1 import html

md = """
<script src="https://cdn.tailwindcss.com"></script>

<div class="bg-blue-500 text-white p-4">Hello, world!</div>
"""

html(md, height=600)
3

Thanks a lot. And apologise for the inconvinence, I didn’t know there’s a way to preview the post.

4

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