23/23 99%

Здравствуйте, подскажите почему не получается 100%?

body {
    width: 350px;
    margin: 0;
    padding: 0 10px;
    font-size: 14px;
    font-family: Arial, sans-serif;
}

table {
    border-collapse: collapse;
    border: 0px;
}

th {
    border: 0px solid black;
    border-top: 1px solid black;
    text-align: left;
    border-bottom: 1px solid black;
    padding: 10px;
    color: white;
}

tr {
    border: 0px solid black;
    border-top: 1px solid lightgrey;
}
td {
    width: 33%;
    padding: 10px;
}

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Испытание: итоговая таблица</title>
    </head>
    <body>
        <h1>Итоговая таблица</h1>
        <table>
        <tr>
            <th style="background-color: darkcyan">Город</th>
            <th style="background-color: lightblue; text-align: center;">Посещений</th>
            <th style="background-color: darkcyan; text-align: right;">%</th>
        </tr>
        <tr>
            <td>СПб</td>
            <td style="text-align: center;">199</td>
            <td style="text-align: right;">65.12</td>
        </tr>
        <tr style="background-color: lightyellow;">
            <td>Москва</td>
            <td style="text-align: center;">69</td>
            <td style="text-align: right;">21.3</td>
        </tr>
        <tr>
            <td>Киев</td>
            <td style="text-align: center;">5</td>
            <td style="text-align: right;">8</td>
        </tr>
        <tr style="background-color: lightyellow;">
            <td colspan="2">Посещений за весь период</td>
            <td style="text-align: right;">273</td>
        </tr>
        </table>
    </body>
</html>
1 лайк

Уже нашел, проблема была в том, что в tr есть и border-top и border-bottom, а я вписал только бордер-топ:1пх.

1 лайк