CODEWITHSUNDEEP
phpcssjsongoogle-visualization
Locksleyu
Locksleyu

Reputation: 5345

Google Charts Table: setting border around entire table, but not individual elements

I have been able to use the documentation here to set the border thickness of each cell of the table using 'tableCell' with CSS (via "cssClassNames"). However I cannot figure out how to make a border around the entire table without effecting the individual cells.

I am not sure if this supported, if someone knows how to do this please let me know.

I am using JSON with PHP to generate my data in case that is relevant.

Upvotes: 0

Views: 646

Answers (1)

asgallant
asgallant

Reputation: 26340

Set a border on the table's container div in CSS:

#myTableDiv {
    border: 2px solid #8367d9;
}

[edit]

If you set the dimensions of the Table in the Visualization's options, you either need to use a more specific selector in the css:

#myTableDiv > div > div {
    border: 2px solid #8367d9;
}

or you need to set the container div to display as an inline-block:

#myTableDiv {
    border: 2px solid #8367d9;
    display: inline-block;
}

I would recommend going with the second approach if it is viable in your case, as the first needs refining to make it work when you have a scrollable table.

Upvotes: 1

Related Questions