Блог

Главная - Вопросы по программированию - Как разбить строку таблицы в столбце на фиксированную ширину

Как разбить строку таблицы в столбце на фиксированную ширину

#html #css

#HTML #css

Вопрос:

Как я могу разбить строку таблицы на столбцы, чтобы таблица соответствовала фиксированной ширине, как показано на прилагаемом изображении?

введите описание изображения здесь

Я пробовал прерывать работу и сворачивать границы, но не дам желаемого результата.

 table {
word-break: break-all;
font-size: 12px;
border-collapse: collapse;
}

Комментарии:

1. Спасибо за голосование.. Я просто не знаю, как мне это сделать. В любом случае я опубликовал то, что я пробовал, но я не думаю, что это сильно поможет

2. Я не проголосовал против. Мне просто нужно посмотреть некоторый код, чтобы дать вам несколько советов / идей 😉

Ответ №1:

Правильно структурируйте таблицу 🙂

Пример

Есть скрипка!

HTML

 <table>
    <tbody>
        <tr>
            <th>Friday</th>
            <th>Saturday</th>
            <th>Sunday</th>
            <th>Average</th>
        </tr>
        <tr>
            <td>$100</td>
            <td>$100</td>
            <td>$100</td>
            <td rowspan="4">$100</td>
        </tr>
        <tr>
            <th>Friday</th>
            <th>Saturday</th>
            <th>Sunday</th>
        </tr>
        <tr>
            <td>$100</td>
            <td>$100</td>
            <td>$100</td>
        </tr>
    </tbody>
</table>

CSS

 table {
    border-collapse: collapse;
    border: solid 1px #CCC;
}
th, td {
    border: solid 1px #CCC;
}