How to make full width from two table header when using jquery

Question

I'm figuring out how to make a full width tr when theres two th. Currently its only taking 20% in last table row. It's hidden on desktop and showing in mobile. Is there any way other than width full and display block?

<table>
  <tbody>
    <tr>
      <th class="name"> taking 20%</th>
      <th class="description"> taking 80%</th>
    </tr>
    <tr> 
      <td>name</td>
      <td>description</td>
    </tr>
    <tr class="hide-table">
      {{-- This  needs to be full width --}}
    </tr>
  </tbody>
</table>