Currently working on a regular navbar, but aiming to have the logo and links span the entire container instead of starting in the middle. I'm seeking an easy solution that won't push out my links when applied.
https://i.sstatic.net/nTFJ6.png
*{
box-sizing: border-box;
margin: 0px;
padding: 0px;
}
body{
background: pink;
}
nav{
display: flex;
justify-content: space-around;
align-items: center;
min-height: 8vh;
background-color: yellow;
}
.logo{
color: whitesmoke;
text-transform:uppercase ;
letter-spacing: 5px;
font-size: 20px;
}
.nav-links{
display: flex;
justify-content: space-around;
width: 25%;
}
li{
list-style-type: none;
}
.nav-links a{
color: black;
text-decoration: none;
letter-spacing: 3px;
font-weight: bold;
}