Никак не пойму в чем дело - не получается убрать лишние 5-7 пикселей справа во второй колонке. Они завязаны друг с другом, при регулировке обе меняются.
Вот код:
.column {
margin: 0px 11px 10px 0px;
padding: 10px 24px 10px 10px;
background: rgba(0, 255, 255, 0.2);
border: 2px solid white;
display: inline-block;
vertical-align: top;
}
Без задания блокам фиксированной ширины решить мне не удалось. Возможно, кто-то предложит вариант получше.
.column {
display: inline-block;
vertical-align: top;
margin: 0px 10px 10px 0px;
width: 100px;
padding: 10px;
box-sizing: border-box;
background: rgba(0, 255, 255, 0.2);
border: 2px solid white;
}
Свойство box-sizing разбирается в этом курсе, перечитайте, если подзабыли:
https://htmlacademy.ru/courses/44/run/15
Всё, теперь разобрался. Спасибо большое, Ineska !
а если так?
.column {
margin-bottom: 10px;
padding: 10px;
background: rgba(0, 255, 255, 0.2);
border: 2px solid white;
display: inline-table;
margin-right: 10px;
width: 76px;
}
Так тоже можно. Просто некоторые очень любят, чтобы всё было кратно пяти.
