That’s how it looks full screen
That’s how it looks like at about less than 1000px
I changed the position for no reason whatsoever…
The graph is not responsive at all and I know it, unfortunately it is going to be tricky because it was made with d3.js and the base project was not responsive: Population Pyramid Chart
The errors are coming from the d3 graph
I am really bad at responsive design.
1 Like
Try rotating graph 180° and numbers also 180°. This can be achieved by using flex.
What kind of layout are you trying to achieve?
To gain more clarity, you could experiment with layout versions or even prototypes before you code the layout. Maybe on paper, or with some prototyping software like Sketch or Adobe XD.
Rotating has nothing with d3. And ordinary css transform: rotate and/or css flex will do just fine. And media queries to encompass these styles . Imagine this: An media query that rotate graph when width get to certain width i.e gets smaller.