Paul Paul - 1 year ago 99
CSS Question

How simplify css style for tables

I have a css code I want to improve. Actually this code was copy-pasted from Chrome styles inspector. But I'm stuck with trying to simplify it into one rule using nesting to get "clean" styles:

.table > thead > tr > th, .table > thead > tr > td,
.table > tbody > tr > th, .table > tbody > tr > td,
.table > tfoot > tr > th, .table > tfoot > tr > td {
border-top: 1px solid #000;

Is there a way to make it simplier?

Answer Source

In table we find <th> and <td> in <thead>, <tbody> and <tfoot> and in above css all the things are targeted so why not simply use this

.table th, .table td{
  border-top: 1px solid #000;

This will also target all <th> and <td> in table.