Hola chicos, tengo el siguiente código:
Código HTML:
<body>
<header>
<div class="logo">
<img src="logo_web.jpg" alt="logo">
</div>
<nav>
<ul>
<li><a href="">Opción 1</a></li>
<li><a href="">Opción 2</a></li>
<li><a href="">Opción 3</a></li>
<li><a href="">Opción 4</a></li>
<li><a href="">Opción 5</a></li>
</ul>
</nav>
</header>
</body>
Y su CSS es:
Código HTML:
* {
margin: 0;
padding: 0;
}
body {
background: #fffffa;
}
header {
width: 100%;
}
header .logo {
float: left;
}
header nav {
background: #024959;
float: right;
margin: 0 auto;
width: auto;
}
header nav ul {
overflow: hidden;
list-style: none;
}
header nav ul li {
float: left;
}
header nav ul li a {
color: #fff;
padding: 20px;
display: inline-block;
text-decoration: none;
}
El nav del menú ocupa el 90% del ancho.
La imagen tiene 4.47Kb y 68 x 72 pix.
La web va a ser responsive.
Cómo hago para que el menú esté junto a la imagen y que ocupen el mismo alto indistintamente del alto de la imagen?
Gracias.