Usamos cookies para medir audiência e melhorar sua experiência. Você pode aceitar ou recusar a qualquer momento. Veja sobre o iMasters.
Rapaziada beleza? Seguinte, to tentando desenrolar aqui no CSS. Porém eu não tenho conhecimento vasto sobre o assunto. Quando eu coloco margin-top:10px. numa DIV(Vamos chamar de div1) que está dentro de uma outra DIV (DIV2) as duas são afetadas sendo que eu só queria que ficasse 10px de margin-top na DIV1. Vou postar os codigos, se puderem resolver meu problema ficaria muito grato! index.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">
<head>
<meta http-equiv="Content-Type" content="text/html. charset=utf-8" />
<title>Rehoboth Crystals</title>
<link rel="stylesheet" type="text/css" href="css/estilo.css">
<link href='[http://fonts.googleapis.com/css?family=Open+Sans'](http://fonts.googleapis.com/css?family=Open+Sans) rel='stylesheet' type='text/css'>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head> <body><div id="barratopo"> <div id="ligueja">Ligue Já! <strong> 3055.1627</strong></div> <div id="botoes"><a href="#"><img src="img/facebook.fw.png" width="30" height="25" /></a></div>
</div><div id="conteudo"> <div class="logomarca"></div>
</div></body>
</html>Dejay, tudo bom?
Utiliza padding na div pai.
exemplo:
HTML
<div id="pai">
<div class="filho"></div>
</div>CSS
#pai {
padding-top: 10px;
background: #fff;
border: 1px solid #333;
}
.filho {
background: red;
}Tambem fiquei com um problema igual aesse
tenta definir a div afetada pela outra em
margin-top:0;
Tenta isso :
Altere só o CSS
@charset "utf-8";
/ CSS Document /
body { margin-top:0px; margin-left:0px; margin-right:0px; font-family: 'Open Sans', sans-serif;}
/ TOPO /
#barratopo {width:100%; height:25px; background:#E5E5E5; }
#ligueja { width:130px; margin-top:5px; margin-left:200px; font:12px Arial, Helvetica, sans-serif; color:#0099FF; float:left;}
#botoes {width:60px; height:25px; margin-right:400px; font:12px Arial, Helvetica, sans-serif; color:#0099FF; float:right;}
/ LOGO /
#logomarca { width:368px; height:91px; background-image:url(../img/logo.fw.png); background-repeat:no-repeat; margin-top:0px; margin-left:50px; }
/CONTEUDO/
#conteudo { width:1000px; height:300px; margin:0 auto; background:#EEE; display:block; padding:10px; margin-top:10px;}
#conteudo .logomarca { width:368px; height:91px; background-image:url(../img/logo.fw.png); background-repeat:no-repeat; margin-top:10px; margin-left:50px; }
/ MENU /
#menu { width:450px; height:55px; float:right; margin-right:100px; }
Será que nao esta faltando um float:left ai nao? Uma vez eu estava com problema e só consegui resolver com esse comando.
Como resolver esse problema de verdade eu não sei te falar, mas se em vez de margin você utilizar o padding vai funcionar. Tanto do div "conteudo" quanto no div "logomarca".
Se você for colocar outro div ao lado do "logomarca" utilize o padding-top no div "conteudo", que aí já vai dar o espaçamento em todos os outros. Mas se for colocar alguma outra coisa colada do div "barratopo" coloca o padding no div "logomarca" mesmo.