Испытание: таблица посложнее [17/23]

Курсы §5. Знакомство с таблицами
1

Помогите, вот что выдает при наложении. Не знаю как убрать рамку сверху , и сделать снизу черную,жирную полоску. А также ошибки при наложенииддд.!

Вот CSS

body {
width: 350px;
margin: 0;
padding: 10px;
font-size: 14px;
font-family: Arial, sans-serif;
}
table{
border-collapse: collapse;
caption-side: bottom;
border-left: none;
border-right: none;
border-top: none;
border-color: lightgrey;
border-bottom: none;
}
th{
border-bottom: 2px solid black;
border-left: none;
border-right: none;
border-top: none;
}
td{
padding: 10px;
border: 1px solid lightgray;
}

2

html вот


Посещения по городам





<tr>
        <td>СПб</td>
        <td>199</td>
        <td>18,02</td>
        <td>00:13:45</td>
</tr>

<tr>
        <td>Москва</td>
        <td>69</td>
        <td rowspan="2">нет данных</td>
        <td>00:00:44</td>
</tr>

<tr>
        <td>Киев</td>
        <td>5</td>
        <td>00:18:07</td>
</tr>

<tr>
        <td colspan="3">Всего посещений</td>
        <td>273</td>
</tr>

</table>

</body>
Город Посещения Страниц Время
3

Начало таблицы не видно.

4

1723
1723.png1920×1080 159 KB

5

все решила уже, спасиб

6

HTML

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>Таблица посложнее</title>
    </head>
    <body>
        <table>
        <caption>Посещения по городам</caption>
        <tr>
        <th>Город</th>
        <th>Посещения</th>
        <th>Страниц</th>
        <th>Время</th>
        </tr>
        <tr>
        <td>СПб</td>
        <td>199</td>
        <td>18,02</td>
        <td>00:13:45</td>
        <tr>
        <td>Москва</td>
        <td>69</td>
        <td rowspan="2">нет данных</td>
        <td>00:00:44</td>
        </tr>
        <tr>
        <td>Киев</td>    
        <td>5</td>  
        <td>00:18:07</td>
        <tr>
        <td colspan="3">Всего посещений</td>
        <td>273</td>
        </tr>
        </table>
    </body>
</html>

CSS
table {
border-collapse: collapse;
border: 1px;
border-spacing: 5px;
}

td {
border: 1px solid lightgrey;
padding: 10px;
}

th {
padding: 10px;
border-bottom: 2px solid black;
}

caption {
caption-side: bottom;
}

получилась короткая ксска

7

Подскажите, почему не засчитывает задание. По моему, судя по картинке 100% попадание в наложении.

image
image.png1600×900 179 KB

8

Переключитесь на вкладку “Различия”.

9

Как минимум потому что никаких side=“bottom” и text-align=“center” у caption быть не должно, так же как не должно быть cellpadding=“10” у таблицы потому что это устаревший подход и ничего этого в HTML5 нету, а side=“bottom” вообще не существует и не существовало никогда.

Из того что я еще увидел, у вас бордер вокруг всей таблицы, а его быть не должно.

10

бордер вокруг всей таблицы есть - это факт. Я прошел тест в итоге с 100% совпадением, код css таблицы:
table {
border-collapse: collapse;
border: 1px;
border-spacing: 5px;
}

11

Зачем вам border-spacing: 5px если он не работает т.к. у вас установлено объединение рамок через border-collapse: collapse?

1 лайк
12

это ладно, согласен. Но как быть с вашим высказыванием: "Из того что я еще увидел, у вас бордер вокруг всей таблицы, а его быть не должно."
По факту видим:
table {
border: 1px;
}

13

И что непонятного? В испытании нету бордера вокруг всей таблицы. Там есть border: 1px solid lightgray; у ячеек (td) и border-bottom: 2px solid black; у ячеек-заголовков (th). Больше там никакие бордеры не нужны.