Scaling plots in Dash + Responsiveness

How do plots scale responsively in Dash? If you shrink the browser to the top right corner, everything will scale well, but for some reason if you shrink the browser only vertically, everything breaks

Is there any way to fix this? If not, I’d like to know how all of this works.

HI @y-arjun-y
Welcome to the Dash community.
Can you please share a minimal working example that we can try on our computers?

https://effectivealtruismdata.com/

Hi @y-arjun-y
I resized the browser in many different ways, including vertically, but it didn’t break for me. Everything scaled correctly. I am using Brave as my browser.

Hmm, I tried on Brave also, but the same issue still occurs. By the scaling issue, I mean that everything overlaps each other, though that’s more of a CSS issue I guess, still can’t figure it out.

Can you please share a screen shot of the overlap.

Sure, this is on the same website I linked to before and all I’m doing is resizing the window only vertically (for some reason it works if you force it to the corner, it’ll all scale well)


Something interesting is that the overlap disappears if I zoom out to around 50-75%, so I guess it really is a CSS issue, I’ll work on that tomorrow and let you know.

By the way, I’m using Google Chrome Version 96.0.4664.110 on macOS.