How to change background color and font weight table header??

[anscsmwn]

<table className="table w-full">
           <thead className="bg-white font-semibold"> <-- Not work 
             <tr>
               <th className="rounded-none">Name</th>
               <th>Date Start</th>
               <th>Date End</th>
               <th>Progress</th>
               <th className="rounded-none">Action</th>
             </tr>
           </thead>
           <tbody>
             <tr>
               <td>Cy Gandertonasdfjsdjafkjsadflkjsfjsdfljasldfj</td>
               <td>Quality Control Specialist</td>
               <td>Blue</td>
               <td>Blue</td>
               <td>
                 <button className="">View</button>
                 <button className="">Delete</button>
               </td>
             </tr>
           </tbody>
         </table>

[saadeghi]

Style for <thead> will not apply because <thead> doesn't have background color or font weight.
Every <th> cell has the style.
So you should either apply that bg-white font-semibold classes to each cell,
or use class names like this to target the <th> child elements: [&_th]:bg-white [&_th]:font-semibold

<table class="table w-full">
  <thead class="[&_th]:bg-white [&_th]:font-semibold">
    <tr>
      <th class="rounded-none">Name</th>
      <th>Date Start</th>
      <th>Date End</th>
      <th>Progress</th>
      <th class="rounded-none">Action</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Cy Gandertonasdfjsdjafkjsadflkjsfjsdfljasldfj</td>
      <td>Quality Control Specialist</td>
      <td>Blue</td>
      <td>Blue</td>
      <td>
        <button class="">View</button>
        <button class="">Delete</button>
      </td>
    </tr>
  </tbody>
</table>

https://play.tailwindcss.com/MyfGy6snVU

[anscsmwn]

Thanks man