Почему div и nav находятся на разных высотах?

Question

[Maxwiwi]

<header>
		<nav class="nav1">
			<ul>
				<li>Support</li>
				<li>Delivery</li>
				<li>Legal</li>
				<li>About Us</li>
			</ul>
		</nav>
		<div class="entrance">$46500 4 items <span class="ent">Login</span><spanclass="ent">Register</span></div>
	</header>

$spade-red:#482423;
body{
	margin:0;

}
li{
	list-style: none;
	color:white;
}
header{
	display: flex;
	flex-direction: column;
	
	align-items: flex-start;
	width:100%;
		height:128px;
		background-color: $spade-red;
	nav.nav1{
			
			ul{
				display: flex;
				margin-left:15vh;

				li{
					padding:10px;
				}
			}
	}
	div.entrance{
		align-self:flex-end;
		margin-right: 15vh;
		
	}
}

Answer 1

[Денис Васильев]

вы указали диву align-self: flex-end;

Comments

[Maxwiwi]

Я понял,потому что он ниже в html коде)А если margin-bottom не работает,то тогда как поднять?

[Денис Васильев]

Если вы хотите центрировать элементы по вертикали, то задайте для родителя align-items: center; и еще убрать flex-direction: column;

[Денис Васильев]

Вам так нужно?
https://codepen.io/pen?editors=1100

[Maxwiwi]

Всё,разобрался))

Answer 2

[Евгений Михалев]

div находится под nav
убрал margin и padding для наглядности
https://codepen.io/anon/pen/MBRxOp