HTML Code:
<!DOCTYPE HTML>
<html>
<head>
<link href="./my.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="div1">
<nav>
<div id="menucontent">
<div id="logo">
<a href="#"><img src="img/logo.png"></a>
</div>
<div>
<div class="desplegable">
<div class="borde">
<a href="#">Operación <span class="iconMenu"></span></a>
</div>
<ul>
<li> <a href="#">Turnos de patio</a></li>
<li> <a href="#">Turnos de administración</a></li>
<li> <a href="#">Conciliación</a></li>
</ul>
</div>
<div class="desplegable">
<div class="borde">
<a href="#">Consultas y reportes <span class="iconMenu"></span></a>
</div>
<ul>
<li> <a href="#">Consolidado de operaciones</a></li>
<li> <a href="#">Convenios de clientes</a></li>
<li> <a href="#">Estado de turnos</a></li>
<li> <a href="#">Estado de cuenta deudores</a></li>
<li> <a href="#">Cierre de jornada fiscal</a></li>
</ul>
</div>
<div class="desplegable">
<div class="borde">
<a href="#">Configuración <span class="iconMenu"></span></a>
</div>
<ul>
<li> <a href="#">Turnos de patio</a></li>
<li> <a href="#">Turnos de administración</a></li>
<li> <a href="#">Conciliación de turnos</a></li>
</ul>
</div>
</div>
</div>
</nav>
</div>
<div id="div2">
</div>
</body>
</html>
CSS Code:
* {
padding: 0;
margin: 0
}
#div1, #div2 {
width: 170px;
}
#div1 {
background-color: red;
display: inline-block; float: left;
}
#div2 {
background-color: blue;
margin-left: 178px; height: 50px;
width: 100%;
}
