Witam wsyzstkich.
Bardzo proszę o pomoc przy wyśrodkowaniu menu. Nie mam zielonego pojęcia jak to zrobić, dlatego piszę tutaj.
Z góry dziękuję.
<header>
<div class="container">
<img src="img/hereads-logo.png" alt="He Reads!" class="float">
<nav class="float">
<ul>
<li><a href="#">Książka</a></li>
<li><a href="#">Serial</a></li>
<li><a href="#">Wylosuj</a></li>
</ul>
</nav>
<div style="clear: both;"></div>
</div>
</header>
header{
background-color: #fff;
font-size: 1em;
border-bottom: 4px solid @orange;
font-weight: 800;
overflow: auto;
padding: 25px 0;
box-shadow: 0 5px 20px #c2c2c2;
img{
width: 250px;
margin-right: 30px;
}
nav{
text-transform: uppercase;
padding: 20px 0 0;
box-sizing: border-box;
ul li{
.float();
padding: 10px;
border-radius: 7px;
.transition(background-color, .3s, ease-in-out);
&:hover{
background-color: @nice-yellow;
}
a:link{
color: @almost-black;
text-decoration: none;
}
a:hover{
text-decoration: none;
}
a:visited{
color: @almost-black;
}
}
}
}
.container{
max-width: 1140px;
min-width: 500px;
margin: auto;
padding: 0 15px 0 15px;
}
.float{
float: left;
}