Всем привет
Осваиваю хтмл-цсс и встрял капитально на верхней горизонтальной менюшке.
Постоянно какие-нибудь размеры кривятся...

Ну и вопрос не в том что бы сверстать, а в том что бы проанализировать мои попытки, объяснить где я был не прав и как надо...


Вот сразу макет в фигме:
https://www.figma.com/file/DbFZjw0g7QL9Z6hAz1DE3f/...

Основная проблема - не выходят ровно менюшки. Либо аватарка вылезает, либо кнопки не симметричные... Хотя это еще только начало)...
Нужно для начала сделать правильный код с коментариями.

Вот что у меня пока вышло: https://drive.google.com/file/d/1aplZoRqspLx58snAn...

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