How to make a linebreak in html.P()?

Why does the following code not lead to

Why no
linebreak?

import dash
import dash_html_components as html

app = dash.Dash(__name__, external_stylesheets["https://codepen.io/chriddyp/pen/bWLwgP.css"])

app.layout = html.Div(html.P('Why no <br/> linebreak?'))

if __name__ == '__main__':
    app.run_server(debug=True, port=8051)

And I how can I do it?

2 Likes

Using html.Br() should do the trick:

app.layout = html.Div(html.P(['Why no', html.Br(), 'linebreak?']))
3 Likes

Or you can use newlines and style={'whiteSpace': 'pre-wrap'} (https://css-tricks.com/almanac/properties/w/whitespace/)

2 Likes

I just figured this out - html is disabled for security reasons. You need to do something like this:

import dash
import dash_html_components as html
import dash_dangerously_set_inner_html

app = dash.Dash(__name__)

app.layout = html.Div(dash_dangerously_set_inner_html.DangerouslySetInnerHTML('Why no <br/> linebreak?'))

if __name__ == '__main__':
    app.run_server(debug=True, port=8051)

as @chriddyp said you can also set the css styles you want.

1 Like

Thanks! Just came across this and it helped me out big time!