@htmlcssnoob1

Как расположить элементы влево?

Как поставить все элементы header вот так: 637954535e659206186390.jpeg
Сейчас вот так: COLrQM_5ju4.jpg?size=1920x120&quality=96&sign=a227d37773b4add5e316228dca4f9e4f&type=album
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Главная страница</title>
	<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
	<div class="header">
		<div class="container">

		</div>
		<div class="header-line">
			<div class="header-logo">
				<img src="logo1 1.png" alt="">
			</div>
			<a class="nav-item" href="#">Главная</a>
			<a class="nav-item" href="#">Список продуктов</a>
			<a class="p"  href="#"><img src="2 1.png"</a>
			<a class="p" href="#"><img src="youtube-1-64x64 1.png"</a>
			<a class="p" href="#"><img src="icons8-discord-48 1.png"</a>
		</div>
	</div>
</div>
</body>
</html>

body{
	margin: 0;
}

.header{
	background-image: url(s1.png);
}
.header-line {
	padding-top: 0px;
	display: flex;
	align-items: center;
	text-decoration: none;
}
.nav-item {
	margin-left: 50px;
	margin-right: 25px;
	color: white;
	text-decoration: none;
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	font-size: 25px;
	line-height: 30px;
}
.p {
	display: flex;
	flex-direction: row-reverse;
}
  • Вопрос задан
  • 72 просмотра
Пригласить эксперта
Ответы на вопрос 1
EPIDEMIASH
@EPIDEMIASH
Человек швейцарский нож
Например:
Вот вам новый блок header-line

<div class="header-line">
        <div class="hl_1">Menu</div>
        <div class="hl_2">Logo</div>
        <div class="hl_3">Icons</div>
    </div>


Вставляете что нужно, и классу header-line приписываете: justify-content: space-around;
Ответ написан
Комментировать
Ваш ответ на вопрос

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

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