Tem espaço nos elementos (sem usar margin)
Pessoal,
O que há de errado neste código, pois tem espaços em alguns elementos com espaços que não tem nem margin nem padding.
Exemplo:
<h2> e <p>
<body>
<div id="main">
<span class="imagem-top"> </span>
<header>
<div id="head">
<section class="social">
<ul>
<li><a class="fb over" href="https://www.facebook.com/pages/" title="Siga-nos no Facebook" id="face" target="_blank">Facebook</a></li>
<li><a class="tw over" href="#" title="Siga-nos no Twitter" id="twitter" target="_blank">Twitter</a></li>
<li><a class="in over" href="#" title="Pagina no Linkedin" id="linkedin" target="_blank">Linkedin</a></li>
<li><a class="gp over" href="#" title="Recomende com o Google Plus" onClick="javascript:abrirGoogle();" id="gplus">Google Plus</a></li>
</ul>
</section><!-- /social -->
<!-- GOOGLE PLUS -->
<div id="google" class="google">
<!-- <span>Nos recomende no Google +1!</span> -->
<g:plusone></g:plusone>
</div><!-- /google -->
<div class="idioma">
<a href="#" title="Português">pt</a>
<a href="#" title="English">en</a>
</div><!-- /idioma -->
<div id="contatos">
<a href="faleconosco.html" class="contato" id="contato">fale conosco</a>
<a href="orcamento.html" class="orcamento">orçamento</a>
</div><!-- /contatos -->
<h1><a href="index.html"><img src="images/logo.png" alt="sdsdsd" title="sdsdsds"></a> </h1><!-- /logo -->
<nav role="navigation">
<ul>
<li class ="nav-empresa"><a title="Empresa" href="empresa.html">Empresa</a></li>
<li class ="nav-servicos"><a title="Serviços" href="servicos.html">Serviços</a></li>
<li class ="nav-clientes"><a title="Clientes" href="clientes.html">Clientes</a></li>
<li class ="nav-trab"><a title="Trabalhe conosco" href="trabalheconosco.html">Trabalhe conosco</a></li>
</ul>
</nav><!-- /nav -->
</div><!-- /head -->
</header>
<!-- fim header -->
<!-- MAIN CONTENT -->
<div id="main-content">
<section id="col-one">
<span class=""> </span>
</section><!-- /col-one -->
<section id="empresa">
<h2>Historia da dsdsds</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
<h2>Por quê a dsdsdpara traduzir seu trabalho?</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</section><!-- /empresa -->
<div class="clear"></div>
</div><!-- /content-main -->
<footer>
<p>©Copyright 2012 - LTDA - <a href="#" title="">Design by </a></p>
</footer>
</div><!-- /main -->
</body>a:link, a:active, a:visited {color: #305F9B;text-decoration: none;}
.clear{clear:both;}
a{ -moz-transition: color 0.5s; -webkit-transition: color 0.5s; -o-transition: color 0.5s; -ms-transition: color 0.5s; transition: color 0.5s;}
p { margin-bottom: 10px; }
h1, h2, h3, h4, h5, h6 { margin-bottom: 5px; }
html, body {height:100%;}
body{
font-family: 'Ropa Sans', "Trebuchet MS", sans-serif;
font-size: 14px;
font-weight: normal;
position: relative;
color: #333;
width: 100%;
height: 100%;
color:#666;
margin: 20px 0px;background:
url(images/mapa_mundi.png) fixed,
url(images/bg.jpg);
background-position: center;
}.social a {width:36px; height:33px; background:url(images/sprite.png) no-repeat; display: block}
/GOOGLE PLUS/
#google{display:none; font-size:15px; position: absolute; left:175px; top: 5px; z-index: 999; }
#main{
width: 980px;
height: auto;
min-height:100%;
background-color: #FFF;
margin: 0 auto;
text-align:left;
box-shadow:0 0 10px rgba(0,0,0,0.5);
position: relative;
overflow: hidden;
}
.imagem-top {
width: 100%;
height: 257px;
position: absolute;
top:0;
right:0;url(images/bg-header.png), url(images/bg-curva-alto.png);
background-position: top left;
background-repeat: no-repeat;
}/HEADER/
#head{width: 100%; height: 256px; padding: 0; margin: 0; position: relative; }
.social{width:145px; height:35px; margin: 20px 0 0 20px; }
.social li{float: left; display:block; background:none !important;}
.over{text-indent:-9000px; overflow:hidden;}
.social a.fb {background-position:-10px -12px }
.social a.fb:hover{background-position:-10px -44px}
.social a.tw {background-position:-50px -12px }
.social a.tw:hover{background-position:-50px -44px}
.social a.in {background-position:-88px -12px }
.social a.in:hover{background-position:-88px -44px}
.social a.gp {background-position:-127px -12px }
.social a.gp:hover{background-position:-127px -44px}
.social li a:link, .social li a:active, .social li a:visited{
-webkit-transition: background 0.5s ease-out;
-moz-transition: background 0.5s ease-out;
-o-transition: background 0.5s ease-out;
-ms-transition: background 0.5s ease-out;
transition: background 0.5s ease-out;
}#contatos{width:145px; height:45px; margin: 20px 0 0 20px; float: left; }
#contatos a{font-size:18px; letter-spacing: 1px; text-transform: uppercase; line-height: 25px; color: #FFF; display: block; }
#contatos a:hover{color: #333;}
.g-plusone{float: left; }
.idioma{float: right; position: absolute; top: 0; right: 10px}
.idioma a{text-decoration: none; font-size: 17px; padding: 2px 4px; width: 10px; height: 10px; background-color: #DDD;
text-align:center; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px;}.idioma a:hover{text-decoration: underline; color: #666; background-color: #FFF;}
header h1{margin-top:0; right:150px; position: absolute; }
nav{
width: auto;
height:40px;
margin:170px 70px 0 0;
font-size: 18px;
font-weight:500;
text-transform: uppercase;
float: right;
border-bottom: 1px dotted #ddd;
}nav li{margin: 0; display: inline;}
nav li a{margin: 0 5px; letter-spacing: 1px;}
nav li a:link { color: #448; text-decoration: underline}
nav li a:visited { color: #BBB; }
nav li a:hover{color: #369;}
/MAIN CONTENT/
#main-content{
overflow:hidden;
width:100%;
height: 100%;
padding: 0;
margin: 0;
background-image: url(images/tracos.png);
background-color: #DDD;
}section#col-one{width: 300px; height: auto; min-height: 200px; float: left; margin: 20px 0 0 20px; background-color: #f4f4f4;}
/FOOTER/
footer {
background: #369 url(images/logo-footer.png) no-repeat right 10px;
padding: 5px;
border-top: 2px solid #999;
position:absolute;
bottom:0;
width:100%;
}footer p{ margin: 10px; font-size: 11px; color: #fff;}
footer a:link {text-decoration: none; color: #000099}
/EMPRESA/
section#empresa, section#servicos, section#clientes{width: 450px; float: right; margin: 0 45px 0 0;}
section#empresa h2{font-size: 25px; color: red; font-weight: 700;}
section#empresa p{font-size:16px; line-height: 20px; }
Discussão (12)
Carregando comentários...