Подскажите где я допускаю ошибку?

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

В последнем задании с таблицами, в крайней нижней правой ячейке, остался хвост в торону, я не понимаю как его убрать?

Ситуация была в том, что я увеличивал ячейку с текстом “Посещений за весь период” - colspan=2 - после чего ячейка справа от неё с текстом “273” вылетела за границы таблицы, пришлось её удалить. Но при создании новой ячейки она так же появлялась за границей - и я так и не понял, как же мне можно вписать текст в ячейку которая есть после растянутой?

После этого я создал новую ячейку перед это растянутой, в растянутой удалил это растяжении и написал 273, а в ново-созданной поставил растяжение и написал нужный текст. В итоге остался хвост, подскажите как в таких ситуациях действовать? Спасибо.

2

Покажите код - это гораздо проще, чем описывать на словах

3 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Испытание: итоговая таблица</title>
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <h1>Итоговая таблица</h1>
<table>
    <tr>
      <td class="column-1">Город</td>  
      <td class="column-2">Посещений</td>   
      <td class="column-3">%</td>
    </tr>
    <tr>
      <td class="tdleft">СПб</td>     
      <td class="tdmiddle">199</td>     
      <td class="tdright">65.12</td>
    </tr>
    <tr class="yellow">
      <td class="tdleft">Москва</td>   
      <td class="tdmiddle">69</td>      
      <td width=33% class="tdright">21.3</td>
    </tr>
    <tr>
      <td class="tdleft">Киев</td>    
      <td class="tdmiddle">5 </td>        
      <td class="tdright">8</td>
    </tr>
    <tr class="yellow">
      <td colspan=2>Посещений за весь период</td>
      <td class="tdright" width=33%>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;
}
tr{
  border-bottom: 1px solid lightgray;
}
td {
    width: 33%;
    padding: 10px;
}
.yellow {
  background-color: lightyellow;
  }
.column-1{
  text-align: left;
  background: darkcyan;
  color: white;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}  
.column-2 { 
  text-align: center;
  background-color: lightblue;
  color:white;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}
.column-3{
  text-align: right;
  background: darkcyan;
  color:white;
  border-top: 1px solid black;
  border-bottom: 1px solid black;
}
.tdleft{
  text-align: left; 
}
.tdmiddle {
  text-align: center;
}
.tdright {
  text-align: right;
}

У меня ещё проблема была с тем, что в правом ряду, когда я пытался текст разместить справа в ячейках, 1 верхняя ячейка норм отрабатывала, а все последующие куда то улетали и меняли таблицу, потом я выставлял в центральном ряду тект по центру и снова вернулся в правый ряд начал вручную прописывать в атрибутах ячеек (<td…>) ширину в процентах (33%) стало норм, потом попробовал удалить эту ширину и осталось норм так и не понял что это было…

4

insert

1 лайк
5

Ячейки первой строки таблицы сделайте <th>.

В HTML не нужны никакие атрибуты, кроме атрибута class

      <td class="tdright" width=33%>273<td> /* не закрыта ячейка */
    </tr>
  </table>
1 лайк
6

Я пробовал их делать th ранее у меня почему о все эти ячейки смещались на один ряд вправо, грубо говоря гармошкой сжимались… я поэтому их и оставил td, сейчас после вашей рекомендации сделал- визуально ничего не изменилось, однако при прохождении теста было 91% проход, стало 82%.

20
Скриншот 2018-09-22 22.19.20.png1920×1080 188 KB

7

Посчитайте, сколько у вас ячеек в последней строке таблицы - т.е. проверьте, сколько открывающих тегов <td>

1 лайк
8

аааа))) вот он этот хвост!

Закрыл этот TD крайний, и все же оставил таблицу без заглавных ячеек, и вот результат 98% Хотя объяснения странному поведению таблицы в процессе у меня до сих пор нет. Я имею ввиду её поведение при введение th (гармошку) и проблем когда я переносил текст вправо в крайнем правом ряду и таблица крушилась, хотя ширина ячеек заданна общая. Такие вот дела.

10
Скриншот 2018-09-22 22.47.10.png1920×1080 199 KB

9

давайте добивать до 100%
Заголовки ячеек, когда они th, по умолчанию идут жирным шрифтом. Если вы хотите их оставить простыми td, то “жирность” необходимо отдельно прописать в свойствах.

1 лайк
10

абсолютно верно)

27
Скриншот 2018-09-22 23.41.27.png1920×1080 222 KB