bootstrap integration with dash

Below is my css,jquery & min.js code ` my_css_url = “https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css” app.css.append_css({ “external_url”: my_css_url }) my_jquery = “https://code.jquery.com/jquery-3.1.0.js” app.scripts.append_script({ “external_url”: my_jquery })

my_js_url = “https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js” app.scripts.append_script({ “external_url”: my_js_url }) `

I am able to get css & jquery of the bootstrap but getting below errors.

plotly-1.31.0.min.js:13 Error: <rect> attribute height: A negative value is not valid. (“-14”) in browser developer tools.

What should i do in order to get rid of these errors.

[LichpinOwl]

import dash import dash_core_components as dcc import dash_html_components as html import plotly.graph_objs as go import plotly as py

external_css = [‘https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css’]

external_js = [‘https://code.jquery.com/jquery-3.3.1.slim.min.js’, ‘https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js’, ‘https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js’ ]

app = dash.Dash(name)

for css in external_css: app.css.append_css({“external_url”: css}) for js in external_js: app.scripts.append_script({“external_url”: js}) app.layout = html.Div([ html.Div([ html.H1([‘Hello world !’], className=[‘col-4’, ‘d-flex’, ‘justify-content-center’ , ‘bg-secondary’]), html.Div([‘btn’], className=[‘btn’, ‘btn-danger’]) ], className=[‘row’]) ], className=[‘container’])

if name == ‘main’: app.run_server(debug = True)

---

---

Running on http://127.0.0.1:8050/ Debugger PIN: 296-361-685 c:\Python27\lib\site-packages\dash\resources.py:45: UserWarning:

A local version of https://code.jquery.com/jquery-3.3.1.slim.min.js is not available

c:\Python27\lib\site-packages\dash\resources.py:45: UserWarning:

A local version of https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js is not available

c:\Python27\lib\site-packages\dash\resources.py:45: UserWarning:

A local version of https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js is not available

Running on http://127.0.0.1:8050/ Debugger PIN: 041-543-092

[ned2]

html.Div(children="First Div", style={"class": "col-md-6"})

should be

html.Div(children="First Div", className="col-md-6")

As I mentioned in the above comment, mixing Bootstrap JavaScript (which uses jQuery) is probably not a good idea as it will conflict with React, which Dash uses. If you’re just using the Boostrap’s CSS, then remove the JS file, it’s not necessary.

Also these sorts of questions are best asked over on the Dash community forum 😄