Display flex - ułożenie divs w row - Forum Pasja Informatyki

pytanie zadane 8 listopada 2022 w HTML i CSS przez zbiku25 Bywalec (2,940 p.)
zamknięte 8 listopada 2022 przez ScriptyChris

Czy wie ktoś może z jakiego powodu divy układają mi się pod sobą zamiast obok siebie? (używam flex direction:row;)

KOD HTML

<body>

Witaj <?php $_SESSION['....']?>

<div id="personal">

	<div class="leftmenu">


	<h5>MENU</h5>
	<ul>
		<li><a href="#"><i class="fa-regular fa-square-plus"></i> Utwórz nową aukcję</a></li></br>
		<li><a href="#"><i class="fa-regular fa-calendar-plus"></i> Aukcje planowane</a></li>
		<li><a href="#"><i class="fa-regular fa-calendar-check"></i> Akucje Zakończone</a></li></br>
		<li><a href="#"><i class="fa-regular fa-user"></i> Twoje dane</a></li></br>
		<li><a href="#"><i class="fa-solid fa-person-chalkboard"></i> Instrukcja</a></li>
	</ul>

	</div>

	<div class="center">
	HELLO WORD <br><br>
	HELLO WORD <br><br>
	HELLO WORD <br><br>
	HELLO WORD <br><br>
	</div>

</div>

</body>
</html>

KOD CSS

#personal
{
	display:flex;
	flex-direction:row;
	border: 3px solid yellow;
	background-color:yellow;
}

.leftmenu
{
	border: 1px solid blue;
	width:20%;
}


.leftmenu ul
{
	list-style-type:none;
}

.leftmenu ul li:hover
{
background-color:yellow;	
}

.leftmenu ul a
{
	text-decoration: none;
	color: black;
	line-height: 1.5;
}

.leftmenu ul a:hover
{
	color: red;
}

.center
{
	display:flex;
	justify-content:center;
	align-items:center;
	border: 1px solid yellow;
}

komentarz zamknięcia: Problem rozwiązany usunięciem błędnego komentarza z kodu

komentarz 8 listopada 2022 przez ScriptyChris Mędrzec (190,190 p.)

Które konkretnie divy układają się pod sobą? Ja widzę, że .leftmenu i .center układają się obok siebie, a elementy listy układają się pod sobą.

komentarz 8 listopada 2022 przez zbiku25 Bywalec (2,940 p.)

Właśnie chodzi o .leftmenu i .center - u mnie układają się pod sobą - załączam screen

komentarz 8 listopada 2022 przez zbiku25 Bywalec (2,940 p.)

@ScriptyChris, OK znalazłem. Błąd był w części kodu CSS przed tym, który wkleiłem. Otóż jako, że jest to nowa strona, w CSS przed #personal dałem sobie komentarz, aby wiedzieć, że tutaj się zaczyna CSS dla tej strony. Jednak zamiast do skomentowania użyć /*... */ , zastosowałem // - i kod css dla #position mi się nie wykonywał (ale dlaczego tak było to już sam nie wiem) :)

W każdym razie dzięki za zaangażowanie i odpowiedź.

Pozdrawiam,