Знакомство с таблицами / Испытание: итоговая таблица [23/23]


#1

хотел бы уточнить есть ли более компактное решение ?

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

</table>    
    </body>
</html>
        body {
        width: 350px;
        margin: 0;
        padding: 0 10px;
        font-size: 14px;
        font-family: Arial, sans-serif;
    }
    table{
     border-collapse: collapse;   
     text-align:center;
    }


    th{
        width:33%;
        border-top:1px solid black;
        background-color:darkcyan;    
        color:white;
        border-bottom:1px solid black;
        padding:10px;
        
    }
    td {
         padding:10px;
        }
    .col-1{
        text-align:left;
    }
    .col-2{
        background-color:lightblue;

    }

    .col-3{
    text-align:right;
    }

    .row-1{
        border-top:1px solid lightgray;
        background-color:lightyellow;
        border-bottom:1px solid lightgray;
    }

#2

Оформите код в сообщении правильно, пожалуйста. Кнопка для форматирования </> в редакторе сообщений.