Как сделать перенос элементов в div?

Делаю меню для сайта и хотел бы сделать так, чтобы все элементы меню стояли друг за другом
61aa37ddebef2859490292.png
Код(пока что пустой):
HTML:
<!DOCTYPE html>
<html>
    <head>
        <title>Главная страница</title>
        <link rel="stylesheet" href="style.css">
        <meta charset="UTF-8">
    </head>
    <body>
        <div class="menu">
            <h2><a href="#">Название</a></h2>
            <img src="defaultUser.png" width="64" height="64"> 
        </div>
    </body> 
</html>


CSS:
@font-face {
	font-family: Railway;
	src: url(font.ttf);
}
body {
	font-family: Railway;
	margin: 0;
}
a {
	text-decoration: none;
	color: black;
}
.menu {
	float: left;
	box-shadow: 0px 0px 5px black;
	position:fixed;
	width: 100%;
	max-width: 100%;
}
.menu a {
	padding-left: 1%;
}
  • Вопрос задан
  • 115 просмотров
Решения вопроса 1
@antares4045
https://html5book.ru/css3-flexbox/

если в двух словах, то:
.menu {
  float: left;
  box-shadow: 0px 0px 5px black;
  position:fixed;
  width: 100%;
  max-width: 100%;
  display: flex;
}

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

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

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