✊🏿 Black Lives Matter. Please consider donating to Black Girls Code today.
⚾️ It's finally Baseball season! Root for the home team... & Register for our Sports Analytics Webinar!

Weird CSS bug with dash-table-experiments

Hi,

I have a weird bug regarding dash-table-experiments with css external_url working while if the css is locally hosted it doesn’t work.

See follow code below for external_url. If the same css file is copied to locally, the page width is broken as it overflows.

External CSS:

Local CSS (Exact Same CSS):

import pandas as pd
import numpy as np
import dash
import dash_core_components as dcc
import dash_html_components as html
import dash_table_experiments as dt
from dash.dependencies import Input, Output, State

import plotly
import plotly.plotly as py
from plotly import graph_objs as go
from plotly.graph_objs import *
from flask import Flask
from flask import send_from_directory
import pandas as pd
import numpy as np
import os
import copy

app = dash.Dash()

app.css.config.serve_locally = False
app.scripts.config.serve_locally = True

app.css.append_css({‘external_url’: ‘https://cdn.rawgit.com/plotly/dash-app-stylesheets/
‘2d266c578d2a6e8850ebce48fdb52759b2aef506/stylesheet-oil-and-gas.css’}) # noqa: E501

app.layout = html.Div([

html.Link(
    rel='stylesheet',
    href='/static/styles.css'
),    

#html.Link(
#rel=‘stylesheet’,
#href=’/static/mystyles.css’
#),

#DATA TABLE
dt.DataTable(
    rows=[{}],
    columns=['Metric', '1801', '1802', '1803', '1804', '1805'],
    id='datatable',
),

],
className=“container”)

@app.server.route(’/static/path:path’)
def static_file(path):
static_folder = os.path.join(os.getcwd(), ‘static’)
return send_from_directory(static_folder, path)

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

@chriddyp Hi Chris, would you know why its the CSS is different externally or internally hosted? I been trying to fix this for many many hours. Thanks

Can anyone please see why?