Доброго времени суток! Я новичок (1 Месяц. За ранее хотел бы сказать, что опыта нету, и не судите строго ),
Учусь верстать сделал макет. Так вот не могу сделать нормальную шапку (Горизонтальная расположения меню):
1 Лого и Текст Лого по левому краю.
6 Текстов для Основных меню по центру
2 Доп. Меню по правому краю
float: left & right - пробовал, grid: тоже, flex-box; тоже, даже через inline-block;
Помогите создать меню, не хочу использовать float left/right. Хотел бы использовать grid сетку (Лучше даже написать свою сетку для будущего) Bootstrap вообще не хочу использовать, буду сидеть и писать но его не буду. Но вот беда что в grid есть косяк он решаемый я видел, но возможно ли найти более такой гибкий метод верстки.
<header class = "roof">
<section class = "container">
<!-- Company Logotype - Layout On The Left Of Top Bar -->
<div class = "logotype">
<a><img src = "Library/Images/Logo.png"></a>
<a><h2>Logo Text</h2></a>
</div>
<!-- Company Main Menu Bar - Layout On The Center Of Top Bar -->
<nav class = "">
<ul class = "">
<li><a href = "#">Main Menu</a></li>
<li><a href = "#">Main Menu</a></li>
<li><a href = "#">Main Menu</a></li>
<li><a href = "#">Main Menu</a></li>
<li><a href = "#">Main Menu</a></li>
<li><a href = "#">Main Menu</a></li>
</ul>
</nav>
<!-- Company Extra Menu Bar - Layout On The Right Of Top Bar -->
<nav class = "#">
<ul class = "#">
<li><a href = "#" >Extra Menu</a></li>
<li><a href = "#" >Extra Menu</a></li>
</ul>
</nav>
</section>
</header>