Как вставить текстовое лого и меню в одну строку так, чтобы лого было справа и меню слева?

Question

[Alexa Ponamareva]

перепробовала много всего float ошибку выдает, само лого и меню на двух строках и никак не двигаются в одну.

Comments

[Владислав Черненко]

float ошибку выдает

это как?
родителю задайте display:flex;justify-content:space-between;

[Alexa Ponamareva]

Владислав Черненко, сложность в том что само лого состоит из двух span, поэтому даже при этом раскладе меню влезает посередине.

<span class="bold">Seven</span><span class="normal">Oaks</span>

Answer 1

[Ankhena]

Изучайте гриды и флексы.
Сделать можно, например, так: https://jsfiddle.net/kj5vf8ah/

Comments

[Alexa Ponamareva]

Спасибо огромное, изменила ваш тег header на div, т.к мы его не проходили. Надеюсь при дальнейших изменениях ничего не пошатнется, там просто псевдоклассы нужно добавить к ссылкам, поэтому много классов, но в целом вы решили мою проблему, благодарю от всей души ваc. А где можно изучать гриды и флексы не подскажете?

[Ankhena]

Alexa Ponamareva,

изменила ваш тег header на div, т.к мы его не проходили.

Было бы логичнее заглянуть в справочник и "пройти" его.

А где можно изучать гриды и флексы не подскажете?

В гугле полно статей.
Например,
флексы https://html5book.ru/css3-flexbox/
гриды https://yoksel.github.io/grid-cheatsheet/
Приятные игры для легкого изучения основ
по флексам https://flexboxfroggy.com/#ru
по гридам https://cssgridgarden.com/#ru

Делать сетки на флоатах это сильно устаревшая техника.
Сейчас флоаты используются исключительно для того, для чего были придуманы: для обтекания одного элемента (например, картинки) другими (текстом).