Using table for content layout is so 1990’s :whistle: lol… tables are actually meant to display tabular data, things like spreadsheet style of content. However, if you still want to use tables, Circumference has these predefined table styles:
Table Styles
You may need to create your own styles or css styles to cancel out what the theme does. If you would like to see where the table styles are for this theme, they are found in the theme’s /css/ folder in the file bootstrap.min.css
You can locate the css styles for the tables, starting with line 48, then all the way down to line 671 that begins with:
table{max-width:100%;background-color:transparent;}
Most of the table styles in the bootstrap css file are based on table classes and not a generic overall style. To get the styles of the tables I have on the demo site, you have to add the classes to the
tag. However, the part that does alignment in your table cell’s, is done around line 2914 in the theme’s style.css file which starts with:
/* Tables */
table td {
vertical-align: middle;
}
Hate to say this, but if you want to use tables for layout of content, this is going to be a bit tough if you are not familiar with customizing with CSS and HTML, because you will probably need to do some adjustments for what you need. I would also suggest not using the class=”table” on your layout tables unless you want the styles associated with that class. I should also mention that when you use tables in a way that you are, your page(s) will no longer be fully responsive for mobile viewing.
An alternative for you if you need an inline column layout is to use inline columns:
Inline Column Demo
Tutorial: Columns
That might be an alternative because you can get a variety (more than what you see on the demo) of layouts, plus these inline columns are responsive too.
The other option is to use The Page Builder plugin such as the one from Site Origin. This theme has a page template that can be used for this but basically you can create all sorts of columns and layouts with a drag and drop method. You can see my introduction video about this here:
Page Builder Template
.
