Semantic ui accordion inside table

I want each table row to be clickable such that it expands like an accordion, but when the accordion activates, it doesn't take up the length of the entire row. How can I make it take up the entire row? The code is below.

<table class="ui selectable accordion fixed single line celled table">
  <thead>
    <tr>
      <th class="one wide id-row">ID</th>
      <th class="fifteen wide name-row">Name</th>
    </tr>
  </thead>
  <tbody>
    {{#each data}}
      <tr class="appRow title">
        <td class="id-row">{{_id}}</td>
        <td class="name-row">{{name}}</td>
      </tr>
        <div class="content">
          <tr>
            <td colspan="2">{{> form}}</td>
          </tr>
        </div>
    {{/each}}
  </tbody>