I'm using vuetify and trying to use either a data-table, or simple table to display rows of checkboxes and a couple of text fields.
However, when I use v-simple-table
all of the checkboxes and fields have their own lines; breaking the table.
<v-form>
<h3>Shifts:</h3>
<v-simple-table>
<thead>
<tr>
<th>Su</th><th>M</th><th>T</th><th>W</th><th>Th</th><th>F</th><th>Sa</th><th>From:</th><th>To:</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-checkbox></v-checkbox>
</td>
<td>
<v-text-field value="9:00"></v-text-field>
</td>
<td>
<v-text-field value="22:00"></v-text-field>
</td>
</tr>
</tbody>
</v-simple-table>
</v-form>
Changing v-simple-table
to just table
gives me the correct layout.
I wouldn't mind using a data-table, but I didn't see a way to have a row of checkboxes instead of a row of data text.
Aucun commentaire:
Enregistrer un commentaire