CODEWITHSUNDEEP
javascripthtmlcssgoogle-visualization
Pho3nixHun
Pho3nixHun

Reputation: 828

Why Google Charts always overflows?

I'm digging google for an hour now, to find out why google chart api makes it's parent dom to overflow.

Scrollbars appear every time I draw the chart

Scrollbars appear every time I draw the chart

As you can see there is no padding or margin. When I use default settings for chart.draw() I got the same result.

As you can see there is no padding or margin

How can I make the chart to just fit in it's container? (overflow: hidden is not a good solution here, because the chart itself also overflows and I don't want to cut it off)

Thank you in advance for any help!

Update: JsFiddle

Upvotes: 3

Views: 3352

Answers (1)

Jonas Grumann
Jonas Grumann

Reputation: 10786

In your case the problem is basically that you specify a height to #chart, and set it to overflow-y: auto. This will cause the vertical scollbar to appear, and since you set the width: 100%, and the vertical scrollbar takes space, a horizontal scrollbar appears. Remove the overflow-y: auto declaration and you're good to go. I suggest you remove the height: 350px as well

Upvotes: 5

Related Questions