Отличный способ выровнять блоки в строку в CSS — display: inline-block

По сравнению с display: inline, основным отличием является то, что display: inline-block позволяет задавать ширину и высоту элемента.

Кроме того, с display: inline-block , верхний и нижний поля/обивка уважают, но с display: inline они не являются.

По сравнению с display: block, основным отличием является то, что display: inline-block не добавляет разрыв строки после элемента, поэтому элемент может сидеть рядом с другими элементами.