I was trying to create a simple table in a post that would be a checklist. It wanted two columns, the first would have a checkbox in it and the second would be the items to check off. Simple right?
Well it turns out, that out of the box, the table block does not resize the columns properly. What happens is, the little check circle was a couple of inches to the left of the text in the second column, not what I wanted at all.
My first though was that there should be a setting to correct this, but I was wrong. My second thought, download a table plug-in, but I decided to check Google and WordPress for an answer first. Finding nothing I started a Tech Support chat with WordPress. They came up with the answer.
The answer was to add some CSS code. CSS or Cascading Style Sheets is a style sheet language used to define visual appearance and formatting of HTML documents. WordPress themes use CSS and HTML to output the data generated by WordPress. Every WordPress theme contains a style.css file which has style rules to define the formatting of pages generated by WordPress.
I had a choice of adding this code to just this post or to my entire site. I decided I wanted tables to work correctly all the time so I went for the whole site. On your “Dashboard” go to “Appearance” and then “Additional CSS”. I added the code in the picture after the code that was already there.
Here it is to copy into yours, if you wish. It works perfectly now.
/* use automatic table width — 22679565-hc (DOC) */
table {
table-layout: auto;
}
