html / css Hur delar jag min nav bar och får en logga i mitten
Halloj allesammans, har precis börjat trixa med html och css som hobby och jag tycker att det är riktigt roligt men har kommit till mitt första problem! Har googlat runt lite och kollat lite på youtube men det blir inte riktigt rätt. Så jag undrar om någon vänlig själ kan ta sig en titt.
Problemet är att min navigation bar är delad i två och men att de sitter längst ut i ändarna till höger och vänster och jag vill ha de lite mer i mitten.
typ så Här vill jag att det ska se ut.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<link href="https://fonts.googleapis.com/css2?family=Russo+One&display=sw..." rel="stylesheet">
<link rel="stylesheet" href="style.css">
</head>
<body>
<nav>
<ul>
<link rel="stylesheet" href="style.css">
<div class="main">
<ul>
<li><a href="index.html">HOME</a></li>
<li><a href="About.html">ABOUT</a></li>
<li><a href="partners.html">PARTNERS</a></li>
<li class="push"><a href="teams.html">TEAMS</a></li>
<li class="push"><a href="shop.html">SHOP</a></li>
<li class="push"><a href="contact.html">CONTACT</a></li>
</div>
</ul>
</nav>
</body>
</html>
css
* {
margin: 0;
padding: 0;
}
body {
background-color: #171820
}
nav {
width: 100%;
height: 130px;
background-color: #0009
}
nav ul {
margin: auto;
padding: 10px 0;
list-style: none;
text-align: right;
}
nav ul li {
list-style: none;
float: none;
display: inline-block;
line-height: 170px
}
nav ul li a {
text-decoration: none;
font-size: 24px;
font-family: 'Russo One', sans-serif;
color:white;
padding: 0 15px;
}
.main ul li:nth-child(1){float: left;}
.main ul li:nth-child(2){float: left;}
.main ul li:nth-child(3){float: left}
