Ir para conteúdo

POWERED BY:

Arquivado

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

Super_Zica_Man

[Resolvido]  em página css

Por , em Desenvolvimento frontend

Recommended Posts

Super_Zica_Man    0

Super_Zica_Man
Postado

Como faço para os primeiros items de cada menu ficam próximo do título (h2), estão com uma pequena margem.

 

index.php

 

<!--
Site no ar desde: Março de 2007
Contador de visitas desde: 20 de Janeiro de 2008
Autor:Rafael Rodrigues Viana
-->
<html>
	<head>
		<title>Grupo Escoteiro Arés</title>
		<link href="estilo.css" rel="stylesheet" type="text/css" />
	</head>
	
		<!-- Body carega o efeito no mouse -->
	<body>
	
	<div id="tudo"> <!-- Engloba todo conteúdo -->

		<div id="topo"></div> <!-- Cabeçalho -->	
	
		<div id="menu"> <!-- Menu -->
   <ul>
	  <li> <a href="index.php?area=principal">Principal</a></li>
	  <li> <a href="index.php?area=contato">Contato</a></li>
	</ul>
	<h2>Escotismo</h2>
	<ul>
	  <li> <a href="index.php?area=escotismo">História</a></li>
	  <li> <a href="index.php?area=dicionario">Dicionário Escoteiro </a></li>
	  <li> <a href="index.php?area=multimidia">Multímidia</a></li>
	  <li> <a href="index.php?area=dicas">Dicas Escoteiras</a></li>
	  <li> <a href="index.php?area=sites">Sites Interessantes </a></li>
	</ul>
	
	<h2>Grupo</h2>
	<ul>
	  <li> <a href="cpg/index.php">Álbum de Fotos </a></li>
	  <li> <a href="index.php?area=historia">História</a></li>
	  <li> <a href="index.php?area=diretoria">Diretoria</a></li>
	  <li> <a href="index.php?area=regulamento">Regulamento</a></li>
	  <li> <a href="index.php?area=localizacao">Localização</a></li>
	</ul>
	
	<h2>Lobinho</h2>
	<ul>
	  <li> <a href="index.php?area=calendario-lobinho">Calendário</a></li>
	  <li> <a href="index.php?area=jogos-lobinho">Jogos</a></li>
	  <li> <a href="index.php?area=membros-lobinho">Membros</a></li>
	  <li> <a href="index.php?area=programacao-lobinho">Programações</a></li>
	</ul>
	
	<h2>Escoteiro</h2>
	<ul>
	  <li> <a href="index.php?area=calendario-escoteiro">Calendário</a></li>
	  <li> <a href="index.php?area=jogos-escoteiro">Jogos</a></li>
	  <li> <a href="index.php?area=membros-escoteiro">Membros</a></li>
	  <li> <a href="index.php?area=programacao-escoteiro">Programações</a></li>
	</ul>
  
	<h2>Sênior</h2>
	<ul>
	  <li> <a href="index.php?area=calendario-senior">Calendário</a></li>
	  <li> <a href="index.php?area=jogos-senior">Jogos</a></li>
	  <li> <a href="index.php?area=membros-senior">Membros</a></li>
	  <li> <a href="index.php?area=programacao-senior">Programações</a></li>
	</ul>
	
	<!-- Contador -->
<?php
include("conta.php");
?>

		</div>	<!-- Fim Menu -->
	
		<div id="conteudo"> <!-- Conteúdo -->
 
		</div> <!-- Fim Conteudo -->
		
		<div id="rodape"> <!-- Rodapé -->
	<p>
	Página Melhor Visualizada em 1024x768
		 <br />
 	© 2007 Grupo Escoteiro Arés | Webmaster <a href="mailto:superzicaman@gmail.com" Rafael</a>
	</p>
		</div>  <!-- Fim Rodapé -->

	</div>	<!-- Fim Tudo -->

	</body>
</html>

estilo.css

 

/* --------------------------------Estilo para construção da página --------------------------------*/

/* Estilo para a body */

body {

margin:0; /* Para centralizar */

padding:0; /* Para centralizar */

text-align:center; /* hack para o IE */

font: 12px Tahoma, Verdana, Arial, Helvetica, sans-serif;

}

 

/* Estilo para a div tudo */

#tudo {

width: 760px;

border: 2px solid #999;

margin:0 auto; /* Para centralizar */

padding: 10px; /* Para centralizar */

text-align:left; /* "remédio" para o hack do IE */

}

 

/* Estilo para a div topo */

#topo {

width: 760px;

height: 100px;

background-color:#006600;

}

 

/* Estilo para a div menu */

#menu {

float: left;

width: 130px;

border:#CCCCCC 0.5px solid;

}

 

/* Estilo para a div conteudo */

#conteudo {

float: left;

width: 550px;

padding: 5px; /* Para centralizar */

}

 

/* Estilo para a div rodapé */

#rodape {

width: 700px;

height: 30px;

padding: 10px 10px;

background-color: #fff;

clear: both;

text-align:center;

}

 

/* ------------------------------------- Estilo para o menu ----------------------------------------*/

 

h2 {

background:#006600;

width:130px;

font:Verdana, Arial, Helvetica, sans-serif;

font-size:12px;

color:#FFFFFF;

}

 

#menu ul {

list-style-type: none;

width:130px;

padding:0;

}

 

#menu li {

border: 1px solid #CCCCCC;

}

 

#menu li a {

font:Verdana, Arial, Helvetica, sans-serif;

font-size:12px;

color:#000000;

text-decoration:none;

}

 

#menu li a:visited {

}

 

#menu li a:hover {

}

 

#menu li a:active {

}

Compartilhar este post

Link para o post
Compartilhar em outros sites

donato    0

donato
Postado

Adiciona no h2

 

padding:0;

margin: 0;

 

vai funcionar

 

 

abraços

Compartilhar este post

Link para o post
Compartilhar em outros sites

Super_Zica_Man    0

Super_Zica_Man
Postado

Adiciona no h2

 

padding:0;

margin: 0;

 

vai funcionar

 

 

abraços

Não deu certo, mas valeu por ajudar.

 

h2 { margin-bottom: 0; }
	ul  { margin-top: 0; }

 

acho que assim dá certo

 

abraço

Esse funcionou valeu

Compartilhar este post

Link para o post
Compartilhar em outros sites

donato    0

donato
Postado

Eu peguei seu código, alterei aq ficou perfeito, estranho, funcionou perfeitamente:

 

h2 {
background:#006600;
width:130px;
font:Verdana, Arial, Helvetica, sans-serif;
font-size:12px;
color:#FFFFFF;

padding:0;
margin: 0;
}

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