I'm trying to customize st.text_area to a specific width and height using CSS - however, it is not responsive to width and height changes. Is there anything else I can try?
def main():
# Custom CSS to modify the textarea width and height
custom_css = '''
<style>
textarea.stTextArea {
width: 800px !important;
height: 400px !important;
}
</style>
'''
st.write(custom_css, unsafe_allow_html=True)
st.title("Custom Textarea Width and Height")
user_input = st.text_area("Type your text here:")
st.subheader("You typed:")
st.write(user_input)
if __name__ == "__main__":
main()
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
You should use
markdownfor styling or html syntax instead ofwriteand make sure you get the correct class.You can also set the height using the
heightparameter. inside If you don't need thetextarea.st-clpart of the clothing css.custom_css = ''' <style> div.css-1om1ktf.e1y61itm0 { width: 800px; } textarea.st-cl { height: 400px; } </style> ''' st.markdown(custom_css, unsafe_allow_html=True)or:
custom_css = ''' <style> div.css-1om1ktf.e1y61itm0 { width: 800px; } </style> ''' st.markdown(custom_css, unsafe_allow_html=True) user_input = st.text_area("Type your text here:", height=400)