How to add a table format into Guide css?

Answered

Posted Apr 05, 2019

I would like to have a way to format all tables that are created in articles so the format is the same. Does anyone have an ideas on how to do this? Could you share code so we can make this simple change to keep tables consistent in format?

Example:

3 comments

Date

Scott Bowen

Apr 11, 2019

If you search for "Tables" in the CSS, you will find the section of attributes for tables in the Help Center. You can tweak the code here to change any table attributes. If you have a couple different ways you want to format specific tables, you can copy that block of code and create a new style. Just make sure to rename the style (For example, it could be something like ".table-small")

If you're not familiar with the HTML for tables, "th" means the table header row, "tr" means the table row, and "td" means each cell in the table.

So if you wanted to format tables to look like your image example, you could set the borders to be orange and affect the padding in the entire table in the "table" class, then specify the blue background and bold font in the "th" class.

This page about HTML table properties can help as well to see the formatting options available, but remember that if you make any formatting changes in the HTML for an article, it won't affect any other tables in the help center.

mfg

Jul 25, 2023

If I paste HTML into the article using the source code button, does CSS override the HTML declared in the table, or would the declared HTML color be displayed?