CODEWITHSUNDEEP
csshtml
user818700
user818700

Reputation:

Google Chart Tools Display in scrollable <Div>

I'm currently using the table in Google Chart Tools to display data I pull from a database. I then go ahead and display this grid inside a scroll-able div. As you can see on the attached screenshot, the column headings for some reason get wrapped to multiple lines, but I would like to have it display the column headings in only one line, not 3 or whatever else it wraps to...

Screenshot

And here is the CSS I use on the div:

.reportGrid {

   width: 1024px;
   height: 300px;
   border: 2px solid #ccc;
   background-color: #ffffff;
   overflow: auto;
}

Does anybody have an idea why this would happen and how to fix it?

Upvotes: 0

Views: 421

Answers (2)

antyrat
antyrat

Reputation: 27765

Add to your CSS class white-space: nowrap;

Upvotes: 1

Chris G.
Chris G.

Reputation: 3981

If you want the column headings to not wrap, then the table must be wide enough to accommodate them.

You can truncate them with javascript dynamically if you have to.

Upvotes: 0

Related Questions