Question

I would like to know how to create a rounded corners on a table head only?

Additional detail… I want to have a rouded head of the table the rest of the table is a rectangle just the first header row should have rounded corners.

Answer 1

The problem is, that you need to make the certain inner elements round.

So you have to make for the first th and the last th round to get the wished solution.

table th:first-child{
  border-radius:10px 0 0 10px;
}

table th:last-child{
  border-radius:0 10px 10px 0;
}