CSS Styling

[kiwis]

I'm looking at Google Charts (specific table charts) as an alternative to my current solution.

Can I apply CSS padding to my table? I want it applied to all rows/columns and cells.

How can I make header backgrounds a specific color and font another?

Also how can I align some content left, middle or right?

[Ray Thomas]

In case you haven't found it yet and it might help someone else, you need to read https://developers.google.com/chart/interactive/docs/gallery/table?hl=en#configuration-options

There are three parts to getting CSS styles to work in tables.

1) Set the HTML and CSS in options

2) Define the class names

3) Write the styles

The options should contain at a minimum

var options = {
   allowHtml: true,
   cssClassNames: cssNames 
};

Then using whatever you called the cssClassNames (I used cssNames, but it can be whatever you want)

var cssNames = {
'headerRow': 'headercss',
'tableCell': 'cellcss'
};

Then write the styling for whatever you called the CSS classes 

<style>
.cellcss { 

    text-align: left;

    padding: 10px;

}

.headercss {

    background-color: blue;     text-transform: uppercase;

    color: white;
}
</style>

[Kelly Royal]

Unsubscribe 

Thanks,
-Kelly

--
You received this message because you are subscribed to the Google Groups "Google Visualization API" group.
To unsubscribe from this group and stop receiving emails from it, send an email to google-visualizati...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/google-visualization-api/682a34fd-a6e1-4e05-9cfe-b67f55e49cc5n%40googlegroups.com.

[Chrystopher Casero Dizon]

"0x74b52fc0bc381b1452e3746907edc4b89fb00bdc0bed041dd76cece98242c848","10982728","1601724692","2020-10-03 11:31:32","0x47ea0ab486f9d00f16d9f248e3388586e061f7f8","0x0bc529c00c6401aef6d220be8c6ea1667f6ad93e","","0","0","0","0.00221285","8.879060625","346.32","","","Approve",""

--