Hi
How can I remove the box around the DatePickerRange?
I can see it’s controlled by this style when I inspect the element, but none of my CSS files have anything related to this on line 732.
border : 1px solid #dbdbdb
In my layout, I have passed the following as part of dcc.DatePickerRange but the border is still there…
dcc.DatePickerRange(
style=dict(border='0px solid #dbdbdb')
)
Could you elaborate on your css setup (and what version of Dash that you are using)? I just tried to create a DatePickerRange component, and i do not sse the border in Chrome nor Edge.
Interesting. I’m using this template and have not changed the CSS at all (other than colours) - https://dash-gallery.plotly.host/dash-financial-report/price-performance (source code: https://github.com/plotly/dash-sample-apps/tree/master/apps/dash-financial-report)
So must be something in there but I can’t see what is controlling it.
Dash versions:
dash 1.8.0
dash-bootstrap-components 0.8.3
dash-core-components 1.7.0
dash-cytoscape 0.0.4
dash-html-components 1.0.2
dash-renderer 1.2.3
dash-table 4.6.2
Anyone have any ideas?
The template includes various .css files, which is why you see the border. It is defined in base2.css in L337 and L372 (focused). To remove it, remove these definitions (or adjust them to your liking).
Thanks - I just tried that and it removes the two boxes around the dates. Ideally I’d like to remove the outer box that goes around the two date boxes (apologies - in hindsight it wasn’t clear in my OP!). Any ideas on that one? I’ve tried commenting out anything referring to “border : 1px” in base2.css but it won’t go!