Откуда берется расстояние между блоками? Почему не работает width 50%?

Question

[verycooldev]

Откуда расстояние (зазор белый) между блоками?
Как сделать их ровно 50% не используя флексбокс?
https://codepen.io/dubx/pen/NBjoOE

Answer 1

[Сергей delphinpro]

Эх, давно я не советовал эту книгу. Новое поколение кодеров подвалило =)

Просвещайтесь (бесплатно, без смс): Инлайновый контекст форматирования

UPD
Кстати, на том же сайте буквально сегодня появилась статья по вашей теме Удивительный и неизвестный inline-block
Можно с нее начать, там много нюансов затронуто, а потом книжку прочитать для полного просветления.

Comments

[verycooldev]

Одно слово - ужас.
Совершенно невменяемая реализация элементарной задачи.

Answer 2

[Кира]

Fighting the Space Between Inline Block Elements

По поводу width, нужно учитывать margin , попробуйте width calc(50% - 1em)

Comments

[verycooldev]

Я учитываю марджин, все равно криво
За ссылку спасибо. Это ужас и омерзение (CSS)

Answer 3

[Алексей Скляров]

Такой зазор возникает между двумя display:inline-block, убрать можно задав каждому из них float:left;

Comments

[verycooldev]

А почему 50% не работает? Учитываю марджин, все равно не ровно