I want make table on html and want make in one th two “under” th .Check picture

Blue underline : person (like: Walter White) .

час. : hours
мин. : minutes

01 02 is like calendar. But me need only how in one “box” make dividing the square. Please help me

it’s my code which i am trying, but how it’s look. But i am need
th – last_name and first_name
second th : hours and minutes BUT need underline

it is code but on vue. You can on html or vue. Doesn’t care . Thank you

<template>
    <div class="container">
        <h1>Опоздания сотрудников за {{ formattedMonth }}</h1>
        <div class="filters">
            <label for="month">Выберите месяц:</label>
            <select id="month" v-model="selectedMonth">
                <option
                    v-for="(month, index) in months"
                    :key=month
                    :value="index"
                >
                    {{ month }}
                </option>
            </select>
        </div>
        <table class="table">
            <thead>
            <tr>
                <th>Сотрудник</th>
                <th
                    v-for="day in daysInMonth"
                    :key="day"
                >
                    {{ day }}
                </th>
            </tr>
            </thead>
            <tbody>
            <tr
                v-for="employee in employees"
                :key="employee.id"
            >
                <td>{{ employee.name }}</td>
                <td v-for="day in daysInMonth" :key="day">
                    <div v-if="employee.lateDays[day]">
                        <div>Мин: {{ employee.lateDays[day].minutes }}</div>
                        <div>Час: {{ employee.lateDays[day].hours }}</div>
                    </div>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</template>

<style scoped>
.container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    font-family: Arial, sans-serif;
}

h1 {
    text-align: center;
    margin-bottom: 20px;
}

.filters {
    margin-bottom: 20px;
    text-align: center;
}

label {
    margin-right: 10px;
    font-weight: bold;
}

select {
    padding: 8px;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 20px;
}

.table th,
.table td {
    border: 1px solid #ddd;
    padding: 10px;
    text-align: center;
}

.table th {
    background-color: #f4f4f4;
}

.table tbody tr:nth-child(even) {
    background-color: #f9f9f9;
}
</style>