Проблемы с позиционированием вертикальной панели навигации. ⇐ CSS

[Anonymous]

Я изучаю CSS, и мне надоело позиционирование. Может кто-нибудь сказать мне, почему вертикальная панель навигации перекрывает горизонтальную? Я хочу, чтобы вертикальная ссылка была прикреплена, а элементы ссылок внутри были абсолютными по отношению к навигационной панели, как вы видите, я пробовал с помощью div, но все равно первая вертикальная ссылка перекрывает горизонтальную.
Это код:
`

Код: Выделить всё

replit


*{
box-sizing: border-box;

}
#hor{
position: static;
text-align: center;
background-color: aqua;
display: block;
}
#hor a{
float: left;
width: 20%;
position: static;
padding: 2%;
}
/* #w{
position: relative;
left:  70px;
bottom: 20px;
} */
header {
text-align: center;
padding: 5vw;
background-color: antiquewhite;
font-weight: bold;
font-family: 'Courier New', Courier, monospace;
}

#ver {
width: 10vw;
background-color: gray;
display: block;
position: relative;

}

#ver a{

display: inherit;
font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
color: blue;

}

#ver a:hover{
color: red;
background-color: green;
}




 THIS IS HEADER

[url=https://www.youtube.com]LINK 1[/url]
[url=https://www.youtube.com]LINK 1[/url]
[url=https://www.youtube.com]LINK 1[/url]
[url=https://www.youtube.com]LINK 1[/url]
[url=https://www.youtube.com]LINK 1[/url]

Как расположить все, чтобы вертикальная панель навигации была закреплена?

Подробнее здесь: https://stackoverflow.com/questions/783 ... cal-navbar