Ir para conteúdo

POWERED BY:

Arquivado

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

Uriel Juliatti

Problema com menu horizontal.

Recommended Posts

Olá! Gostaria de saber o erro do meu script. (Eu explico no final de tudo, vá lá embaixo!)

 

Vejam o CSS:

 

@charset "utf-8";
/* CSS Document */

#menu, #menu * {margin: 0; padding:0;}

#menu {
position:absolute;
padding:0px;
margin:0px;
float: left;
width: 200px;
list-style:none;
}

#menu ul li { display: inline; }

#menu ul li a {
padding: 2px 18px;
background-image:url(menu_esq.jpg);
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
float:left;
/* visual do link */

color: #e68600;
text-decoration: none;
border-bottom:30px solid #e68600;
}

#menu ul li a:hover {

background-color:#1f1f1f;
color:#FFFFFF;
border-bottom:30px solid #1f1f1f;
}

ul.seta{ background-image:url(seta.png);
border-right-color:#009900;
padding:0px;
margin:0px;
}
li.seta{
list-style-image:url(seta.png);
}

#menu3, #menu3 * {margin: 0; padding:0;}

#menu3 {
position:absolute;
margin-left:-456px;
padding:0px;
float: left;
width: 303px;
list-style:none;
background-color:black;
}

#menu3 ul li { display: inline;}

#menu3 ul li a {
padding: 3px 6px;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
float:left;
color:#fe461b;
background-color:#000000;
/* visual do link */
border-bottom:30px solid #e68600;
}

#menu3 ul li a:hover {
color:#e68600;
background-color:#666666;
padding: 3px 6px;
border-bottom:30px solid #e68600;
}

#tudo

 {width:750px; margin: 0 auto; padding: 0;}

#topo
{
	background-image:url(topo.jpg);
	margin-top:0px;
	width:800px;
	height:71px;
	float:left;
}

#menu1{
	background-color:#333333;
	height:13px;
	margin-top:73px;
	width:180px;
	position:absolute;
}

#menu2{
	background-color:#1f1f1f;
	height:13px;
	margin-top:23px;
	width:420px;
	position:absolute;
}

#busca{
background-image:url(busca.jpg);
width:164px;
height:36px;
margin-left:216px;
margin-top:71px;
position:absolute;
}

#foto{
	background-image:url(hospital.jpg);
	height:202px;
	width:215px;
	margin-left:420px;
	background-repeat:no-repeat;
	position:absolute;
	top: -96px;
}

#fundotab{
	background-color:#e68601;
	margin-top:209px;
	height:57px;
	width:746px;
	margin-left:40px;
	position:absolute;
	top: 1px;
	visibility: visible;
}

#fundotab2{
background-color:#333333;
margin-top:20px;
height:500px;
	width:730px;
	margin-left:0px;
	position:absolute;
	top: 1px;
}

#fotolab{
background-image:url(home.jpg);
margin-left:32px;
margin-top:-50px;
width:237px;
height:323px;
position:absolute;
	top: 1px;
}

#conteudo1{ font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:9px;
color:#FFFFFF;
width:450px;
height:300px;
margin-left:220px;
position:absolute;
margin-top:35px;
float:left;


}

ul{ list-style-image:url(marcador.jpg);

position:absolute;
float:left;
padding-left:30px;
padding-top:20px;
margin-left:10px;
line-height:20px;
}
p{
font:Verdana, Arial, Helvetica, sans-serif;
color:#CC3300;
font-size:9px;
margin-top:0px;
margin-bottom:-10px;
padding:0px;
line-height:3px;
}
li{
padding-left:0px;
padding-top:0px;

}
body {
margin:0px;
padding:0px;
background:black;

}

 

Agora o XHTML:

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Página Laboratório - Teste</title>

<style>

@import url('estilo.css');

</style>

</head>

<body>
	<div id="tudo">
	<div id="topo">
	<div id="menu1">
		<div id="menu">
<ul>
<li><a href="">home</a></li>
<li><a href="">links</a></li>
<li><a href="">labs</a></li>
</ul>
	<div id="menu2">
		<div id="foto">
	<div id="busca">
			<div id="menu3">
<ul class="seta">
<li><a href="">recursos</a></li>
<li><a href="">trabalhe conosco</a></li>
<li><a href="">nossa empresa</a></li>
</ul></div></div></div></div></div></div>
	<div id="fundotab">
	<div id="fundotab2">
	<div id="fotolab">
	 <div id="conteudo1">
	<ul>
		<li><p>Texto</p><br /> Texto, Texto etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal<br />
		  <br />
		</li>
		<li><p>Texto 2</p> <br /> 
		  Texto, Texto etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal e tal e tal e tal etc e tal
		</li>
	</ul>
	</div>
	</div></div></div></div></div>
</div>
   
</body>
</html>

 

O arquivo hospedado no meu website:

 

http://www.urieljuliatti.net/laranja/

 

 

Como podem ver.. O segundo menu que se chama "#menu3" e que na página aparece nos links "rtecursos", "trabalhe conosco" e "nossa empresa" está apresentando o MESMO background do "#menu", o que nao é para acontecer. Mesmo mudando o background no "#menu3" não altera em nada. Qual seria o problema?

 

Agradeço desde já pela colaboração de todos que se dispuserem a me ajudar!

 

Abraços.

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

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