Едет верстка — как исправить?

Question

[Антон]

https://codepen.io/anon/pen/mpjGzr
Мне нужно внутри left вписать тексты, но начинает ехать верстка
<div class="left"></div>
Едет так https://codepen.io/anon/pen/ppZOQK

Comments

[Ankhena]

display: flex родителю

либо вертикальное выравнивание детям, по умолчанию оно по базовой линии шрифта, вот всё и уехало при добавлении текста

Answer 1

[Максим Тимофеев]

vertical-align:top; добавь к .left

Answer 2

[NaN]

задай .left и .right значение width в процентах, убери лишние margin, а для родителя задай padding если нужен. Но да, через флексы все было б проще и меньше кода

https://codepen.io/ViktoriaKorneva/pen/KZBGgr