Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Fernando Isnaldo

Lista, submenu e fazer ficar na mesma linha

Por , em Desenvolvimento frontend

Recommended Posts

Fernando Isnaldo    0

Fernando Isnaldo
Postado

Meu codigo HTML

 

<html>
<head>
<title>Les Power Info</title>
<style type="text/css">body {background-image: url('http://i33.servimg.com/u/f33/16/43/99/18/sem_ta14.gif');}
.icones {
text-align: center;
position:fixed; 
background-position: center;
bottom: 30%;
left: 34%;
background-image: url('http://i.imgur.com/sI3S2.png');
}
.icones img{ max-width: 18%!important;}
.res li {display: block}
.res img {max-width: 48%;}
.navlinks li{position:relative}
.ulhome{left:0px;top:40px;position:absolute !important;display:none;z-index:999;text-align:center !important; background-color: #FFFFFF !important; !important;border:1px solid #690;list-style:none;position:relative;z-index:990;}
.ulhome ul{text-align:left;border: 1px solid #CCCCCC;padding:0px 14px 0px 3px;}
.ulhome .limenup an{text-decoration:none;display:block;z-index:900;background-image:none !important;}
li:hover .ulhome{left:0px;display:block;top:13px !important}
</style>




</head>
<body><div align="center" class="res">


<ul><li><a href="http://www.lespowerinfo.co.cc/forum"><img src="http://i.imgur.com/vGSD1.png"/></a>
<div class="ulhome"><div style="background-color: #F2F2F2"><ul><li class="limenup"><a href="http://www.lespowerinfo.co.cc/c2-">Central<br></a></li><li class="limenup"><a href="http://www.lespowerinfo.co.cc/c3-">Softwares<br></a></li>
<li class="limenup"><a href="http://www.lespowerinfo.co.cc/c1-">Hardwares<br></a></li>
<li class="limenup"><a href="http://www.lespowerinfo.co.cc/c4-outros">Outros<br></a></li>
</ul></div>
</li>
<li><a href="http://www.lespowerinfo.co.cc/"><img src="http://i47.tinypic.com/2z68os5.png"/></a>
<div class="ulhome">
<div style="background-color: #F2F2F2"></div><ul>
<li class="limenup"><a href="http://www.lespowerinfo.co.cc/chatbox">Chat Box<br></a></li>
<li class="limenup"><a href="http://www.lespowerinfo.co.cc/f44-">Novidades<br></a></li>
<li class="limenup"><a href="http://www.lespowerinfo.co.cc/h7-">Parceiros<br></a></li>
</ul>
</li>

</div>


<div class="icones">
<a href="http://www.lespowerinfo.co.cc/c2-"><img src="http://i.imgur.com/quaPC.png"/></a>
<a href="http://www.lespowerinfo.co.cc/c1-"><img src="http://i.imgur.com/c4djO.png"/></a>
<a href="http://www.lespowerinfo.co.cc/c3-"><img src="http://i.imgur.com/VThJL.png"/></a>
<a href="http://www.lespowerinfo.co.cc/c6-"><img src="http://i.imgur.com/kHtNK.png"/></a>
<a href="http://www.lespowerinfo.co.cc/c4-"><img src="http://i.imgur.com/dOu1W.png"/></a></div>
<br>
</body>
</html>

http://www.lespowerinfo.co.cc/h1-pagina

 

Estou tentando fazer as imagens ficarem na mesma linha, e fazer o submenu ficar abaixo da imagem. Como eu faço isso?

 

 

 

EDIT: Consegui resolver o problema de pontos das tags <li>

Compartilhar este post

Link para o post
Compartilhar em outros sites

Maujor    144

Maujor
Postado

Altere CSS como indicado a seguir:

.navlinks li {
 position:relative; 
 display: inline; <=================
}

.icones { 
 text-align: center; 
 position:fixed;  
 background-position: center;
 bottom: 55%; <===================
 left: 34%; 
 background-image:   url('http://i.imgur.com/sI3S2.png'); 
}

Compartilhar este post

Link para o post
Compartilhar em outros sites
Ir para a lista de tópicos Desenvolvimento frontend
×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.

  Aceito