Home/ Questions/Q 8252043
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-08T00:26:12+00:00

I have some CSS theming which I would like to do to the head

  • 0

I have some CSS theming which I would like to do to the head of a table which the head of the table does not actually support. (great, right?!)

So my idea was to add an element BEHIND the table head and apply the theming to that!

However my attempts to add tables, tbodies, theads, th’s, or td’s with negative z-indexes have all failed miserably.

On the flip side, I could put my table header in its own table and then encapsulate the table and do the theming on THAT… But then the th’s in my header would not be aligned to the td’s in my tbody! I can’t encapsulate the tbody or td’s/tr because divs are not allowed inside tables when not encapsulated by td or tr…

The effects I want to do are:
Set border width and color
Set border radius
Set background-image and color

The border radius is what will not work

Any ideas?

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I am not sure this is what you are looking for but you can set CSS for table header using ‘th’ element.
    For eg. try the following implementation,

    <!DOCTYPE html>
<html>
<head>
<style type="text/css">

td
{
border:1px solid black;
}
thead th
{
border:1px solid green;
}
thead th:first-child
{
border-radius:12px 0px 0px 12px;
}
thead th:last-child
{
border-radius:0px 12px 12px 0px;
}
</style>
</head>

<body>
<table cellpadding="0" cellspacing="0">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Middlename</th>
</tr>
</thead>
<tbody>
<tr>
<td>Peter</td>
<td>Griffin</td>
<td>Griffin</td>
</tr>
<tr>
<td>Lois</td>
<td>Griffin</td>
<td>Griffin</td>
</tr>
</tbody>
</table>
</body>
</html>

    Please check the link.

    You can also set border radius using CSS3.

    border-radius:10px 0 0 10px;

    If cross-browser compatibility is a problem you can use rounded images as background.

    • 0