Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Boa noite! :)
Aqui vai:
Como queria que ficasse > http://img258.imageshack.us/img258/7753/visual.png
Como tá ficando > http://www.crfh0m3r.xpg.com.br/
É o seguinte, queria que a DIV em azul tivesse um espaçamento de 1px em relação as DIVs acima dela, no caso Slideshow1 e Slideshow2, mas não é o que acontece, já tentei adicionar margin mas não acontece nada. Queria saber o que posso fazer nesse caso, e em outros se isso acontecer.
HTML
<!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">](http://www.w3.org/1999/xhtml)
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Party MCZ</title>
<link href="css/estilos.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="pagina">
<div id="logotipo">
<h1>LOGOTIPO</h1>
</div><!--Fim da div LOGOTIPO -->
<div id="menu">
<ul><li><a href="#"><img src="icones/iconza_16x16_808080/house_16x16.png" border="0"/> HOME</a></li>
<li><a href="#"><img src="icones/iconza_16x16_808080/camera_16x16.png" border="0"/> GALERIA</a></li>
<li><a href="#"><img src="icones/iconza_16x16_808080/newspaper_16x16.png" border="0"/> NOTÍCIAS</a></li>
<li><a href="#"><img src="icones/iconza_16x16_808080/film_16x16.png" border="0"/> VÍDEOS</a></li>
<li><a href="#"><img src="icones/iconza_16x16_808080/mail_16x16.png" border="0"/> CONTATO</a></li></ul>
</div><!--Fim da div MENU -->
<div id="slideshow1">
<div id="cabeçalho">
<h3 class="cabeçalho1">Slideshow 1</h3>
<p class="cabeçalho1">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id metus vitae purus lacinia ultrices. In hac habitasse platea dictumst. Donec eu tellus nulla. Nulla venenatis arcu sit amet magna placerat eget ullamcorper quam ultrices. Mauris viverra risus id lorem interdum eu tempor nunc dignissim. Ut sed mauris quis lacus ultricies elementum in et ante. </p>
</div><!--Fim da div Cabeçalho1 -->
</div><!--Fim da div Slideshow1 -->
<div id="slideshow2">
<div id="cabeçalho2">
<h3 class="cabeçalho2">Slideshow 2</h3>
<p class="cabeçalho2">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras id metus vitae purus lacinia ultrices. In hac habitasse platea dictumst. Donec eu tellus nulla. Nulla venenatis arcu sit amet magna placerat eget ullamcorper quam ultrices. Mauris viverra risus id lorem interdum eu tempor nunc dignissim. Ut sed mauris quis lacus ultricies elementum in et ante. </p>
</div><!--Fim da div Cabeçalho2 -->
</div><!--Fim da div Slideshow2 -->
<div id="nave">
<div id="noticias">
</div><!--Fim da div NOTÍCIAS -->
<div id="agenda">
</div><!--Fim da div AGENDA -->
<div id="galerias">
</div><!--Fim da div GALERIAS -->
<div id="twitter">
</div><!--Fim da div TWITTER -->
</div><!--Fim da div NAVEGAÇÃO -->
</div><!--Fim da div PÁGINA -->
</body>
</html>CSS
@charset "utf-8";
/ CSS Document /
/***********
tags globais
***********/
body {
margin:0px;
padding:0px;
}ul, li{
display:inline;
list-style:none;
}/***********
tags do site
***********/
#pagina {
width: 900px;
height: auto;
margin: 0 auto;
text-align: left;
}
#logotipo {
padding-left:5px;
height:145px;
background-color:#8090AB;
}
#menu {
width:900px;
height:40px;
margin:1px auto;
text-align:center;
font-size:20px;
font-family:"Trebuchet MS", Arial, Helvetica, sans-serif;
color:#3CC;
background-color:#FF9966;
} padding-right:15px;
padding-left:15px;
color:#000;
text-decoration:none;
} padding-right:15px;
padding-left:15px;
background-color:#900;
}
#slideshow1 {
float:left;
width:450px;
height:auto;
background-color:#CC99CC;
}
p.cabeçalho1 {
margin:3px;
text-align:justify;
}
#slideshow2 {
float:right;
width:449px;
height:auto;
background-color:#CCCCCC;
}
p.cabeçalho2 {
margin:3px;
text-align:justify;
}
#noticias {
clear:both;
height:205px;
background-color:#3399CC;
}Outra dúvida é, como vocês veem na imagem, em azul tem várias outras seções, Notícias, Agenda, Galerias Twitter, nesse caso, serão outras DIVs ou posso fazer essa divisão sem esse recurso?
Espero respostas.
Desde já, obrigado.
Carregando comentários...