Boas,
Estou com um pequeno problema.
Quero colocar o meu Menu com os dados da seguinte Forma:
WebMail | Contactos | LOGO | Multimedia | Documentos |
Mas estou com um problema em colocar os dois ultimos temas do lado direito.
HTML:
Código :
CSS:
Código :
Encontra-se desta forma : http://jsfiddle.net/kbhzgb36/
Estou com um pequeno problema.
Quero colocar o meu Menu com os dados da seguinte Forma:
WebMail | Contactos | LOGO | Multimedia | Documentos |
Mas estou com um problema em colocar os dois ultimos temas do lado direito.
HTML:
Código :
<div id="nav">
<ul>
<li><span class="Webmail" ></span><a href="#"> Webmail </a></li>
<li><span class="Contactos" ></span><a href="#"> Contactos </a></li>
<img src="image/logo.JPG"/>
<li><a href="#"> Multimedia </a></li>
<li><a href="#"> Documentos </a></li>
</ul>
</div>
<ul>
<li><span class="Webmail" ></span><a href="#"> Webmail </a></li>
<li><span class="Contactos" ></span><a href="#"> Contactos </a></li>
<img src="image/logo.JPG"/>
<li><a href="#"> Multimedia </a></li>
<li><a href="#"> Documentos </a></li>
</ul>
</div>
CSS:
Código :
#nav { Width: 100%; background:#CCC; Margin:0px; Float:left;}
#nav ul { margin: 0; padding: 0; list-style: none; width:100%; float:left; }
#nav ul li { float: left; font: 16px arial; }
#nav ul li a { color:#888; text-decoration:none; padding:20px; display:block; }
#nav ul li:hover {background: #666}
#nav ul li .Webmail { background: url(image/1-email.png) no-repeat center; float: left; width: 100%; padding: 30px 0; margin-bottom: 15px; }
#nav ul li .Contactos { background: url(image/2-contactos.png) no-repeat center; float: left; width: 100%; padding: 30px 0; margin-bottom: 15px; }
#nav ul li .Multimedia { background: url(); float: left; width: 100%; }
#nav ul li .Documentos { background: url(); float: left; width: 100%; }
#nav ul { margin: 0; padding: 0; list-style: none; width:100%; float:left; }
#nav ul li { float: left; font: 16px arial; }
#nav ul li a { color:#888; text-decoration:none; padding:20px; display:block; }
#nav ul li:hover {background: #666}
#nav ul li .Webmail { background: url(image/1-email.png) no-repeat center; float: left; width: 100%; padding: 30px 0; margin-bottom: 15px; }
#nav ul li .Contactos { background: url(image/2-contactos.png) no-repeat center; float: left; width: 100%; padding: 30px 0; margin-bottom: 15px; }
#nav ul li .Multimedia { background: url(); float: left; width: 100%; }
#nav ul li .Documentos { background: url(); float: left; width: 100%; }
Encontra-se desta forma : http://jsfiddle.net/kbhzgb36/