My style for nav ...

nav.menu-desktop{
width: 15%;
height: 100%;
background-color: #b54e74;
margin-top: 4px;
margin-left: 4px;
margin-right: 8px;
margin-bottom: 8px;
font-size: 24px;
color: whitesmoke;
float: left;
display: box;}

doesn't work on my html site:

<nav id ="menu-desktop">
<div align="left" >
<p align="center" >Menu</p>
<ul>
    <li><a href="kontakt.html">Kontakt</a></li>
    <li><a href="moje_konto.html">Moje konto</a></li>
    <li><a href="OVenidi.html">O Venidi</a></li>
</ul>
</div>
</nav>

I tried getting rid of the div but it did nothing. Other styles work just fine and I have no idea why this one doesn't. Issue

CodePudding user response：

Nav element have id, your seletor is class selector. Change nav.menu-desktop to nav#menu-desktop

CodePudding user response：

I see two problems in your code:

1. nav.menu-desktop: you're calling an id with a class name. Fix it to nav#menu-desktop
2. There's no closing tag for nav tag in the HTML you provided.

CodePudding user response：

Instead of using the display Box, I would recommend you to use flex. As flex works across all devices it can easily solve your problem.

You can refer to this link for better understanding of flex

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

CodePudding user response：

try using "100vh" not "100%" ('vh' is the page height)