@Alexxxey_enot

Ссылки в шапке идут с начала а не с конца хотя свойтсво flexend применил. Может еще что-то не написал?

<header class="header">
		<div class="container">
			<div class="header__inner">

				<div class="nav">
					<a href="#" class="nav__link">Sign Up</a>
					<a href="#" class="nav__link">Log In</a>
					<a href="#" class="nav__link">Support</a>
				</div>			

			</div>
		</div>
	</header>

CSS:
.container{
	width: 100%;
	max-width: 1180px;
	margin: 0 auto;
}

.header{
	display: flex;
	padding-top: 50px;
}

.header__inner{
	position: absolute;
	justify-content: flex-end;
}

.nav{
	font-size: 19px;
	color: #b7bfc5;
	position: relative;
}

.nav__link{
	text-decoration: none;
}


5ff589a4b4403624440007.png
  • Вопрос задан
  • 61 просмотр
Решения вопроса 2
Ankhena
@Ankhena Куратор тега Вёрстка
Нежно люблю верстку
Не очевидно, какого результата нужно достичь, но
посмотрите https://jsfiddle.net/x6mrLqsy/
я рамочками обвела каждую из оберток, чтобы вы увидели что у вас происходит.

Дальше, вы пишете
.header__inner{
  position: absolute;
  justify-content: flex-end;
}

но justify-content не работает без display: flex
И не ясно зачем ему абсолют. Еще и при том, что нет ни одного родителя с relative.
Зачем-то родителю .header__inner задан flex, хотя в нем один ребенок, да и тот абсолют.

Вероятно, вы хотели получить такой результат https://jsfiddle.net/84xh0f1r/
Ответ написан
@Anonimmus
Position: absolute - делает ваш блок плавающим, тобишь указав ему left: 0 или right: 0. Вы его спозиционируете, а вот от какого элемента - неизвестно, плавающий блок должен иметь родителя с position: relative (от кого отталкиваться).
Пример вам уже написали ☝️выше
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы