Ir para conteúdo

POWERED BY:

Arquivado

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

FernandoPhP

pulando linha do nada

Por , em Desenvolvimento frontend

Recommended Posts

FernandoPhP    9

FernandoPhP
Postado

Boa noite a todos,

 

Crei um layout com tableless que ficou legal, mas ocorre que tem uma liha que é pulada do nada, quero tirar isso, deixar o layout certinho, já procurei pelos margin e padding, mas não tem nada errado, o link da página é esse:

Link

pode-se ver o código fonte para entender o que está acontecendo, mas vou mostrar aqui:

 

<!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>CidaBarros</title>
<link rel="stylesheet" type="text/css" href="css/cida.css" />
<script language="JavaScript" src="script/jquery.js" type="text/javascript"></script>
<script src="script/jquery.orbit.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="css/orbit.css" />
<script src="script/home_orbit_config.js" type="text/javascript"></script>
</head>
<body style="background:#303"><div style="margin-left: auto; margin-bottom: 0; margin-right: auto; margin-top: 40px; width: 1024px; background-image:url(imagens/cidabarros.jpg); background-position:top; background-repeat:repeat-x;">
<div style="width: 1024px;">
  <div>
     <div style="width: 10px; height: 550px; float: left;"></div>
     <div style="width: 238px; height: 550px; float: left;"><img src="imagens/logomin.png" style="margin: 50px 15px 15px 15px;" /></div>
     <div style="width: 10px; height: 550px; float: left;"></div>
     <div id="conteudo">
 	 <div id="linha2" style="margin-top: 50px; text-align: center; line-height:12px; color:#DAC2CD;" class="rodape"> Endereço - Telefone - Emails
 </div>
 <div class="clear"></div>
 <div style="width: auto; text-align: center;  margin: auto; padding: 0pt; width: 740px; height: 400px;">
       <div id="flash"> 
               <!-- START FLASH --> 
               <div id="home_featured">
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG0.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG1.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG2.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG3.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG4.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG5.jpg" /></a></div>
                                                       <div class="content"><a href="#"><img alt="" src="imagens/home_imagens/BG6.jpg" /></a></div>
                                       </div> 
               <!-- END FLASH -->
       </div>
</div>
 <div class="clear"></div>
 	 <div id="linha2" style=" text-align: center; line-height:12px; color:#DAC2CD;" class="rodape">
    <a href="index.php">Home</a> - <a href="index.php?page=perfil" class="rodape">Perfil</a> - <a href="index.php?page=galeria">Galeria</a> - <a href="index.php?page=contato">Contato</a>
 </div>
     </div>
     <div class="clear"></div>
  </div>
</div>
</div>
</body>
</html>

 

E o Css usado estão em dois arquivos:

Esse foi o que eu criei

#linha1 {
width:918px;
height: 25px;
background-image:url(../imagens/sombra_topo.png);
}
#recuolinha1 {
float:left;
width:72px;
height: 25px;
}
#conteudolinha1 {
float:left;
height: 25px;
}
.clear{
clear:both;	
}
#linha2 {
width:740px;
height: 16px;
background: #7F5065;
}
#conteudolinha2 {
float:left;
height: 16px;
margin-left: 46px;
}
#linha3 {
width:740px;
height: 25px;
}
#conteudolinha3 {
float:left;
height: 25px;
margin-left: 46px;
}
#padesq {
float:left;
width: 26px;
height: 430px;

background-image:url(../imagens/sombra_esq.png);
}
#paddir {
float:left;
width: 26px;
height: 430px;
background-image:url(../imagens/sombra_dir.png);
}
#conteudo {
float:left;
width: 740px;
height: 430px;
/*	margin: 10px;*/
}
#button{
width:918px;
height: 25px;
background-image:url(../imagens/sombra_baixo.png);
}
.rodape a{
   padding: 0 13px;
   font-family: Arial, Helvetica, sans-serif;
   font-size: 12px;
   font-weight: bold;
   color:#DAC2CD;
   text-decoration:none;
}
.rodape a:hover {
   color:#ffffff;
}
.h415{
  height:400px;
  background:url(../imagens/backgroundct.png);
}

 

Esse é o da própria galeria

/* CSS for jQuery Orbit Plugin 1.2.s
* www.ZURB.com/playground
* Copyright 2010, ZURB
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php


/* CONTAINER
  ================================================== */

div.orbit-wrapper {
   width: 1px;
   height: 1px;
   position: relative; }

div.orbit {
   width: 1px;
   height: 1px;
   position: relative;
   overflow: hidden }

div.orbit>img {
   position: absolute;
   top: 0;
   left: 0;
   display: none; }

div.orbit a img {
   border: none }

.orbit div {
   position: absolute;
   top: 0;
   left: 0;
   width: 740px;
   height: 400px; }


/* TIMER
  ================================================== */

div.timer {
   width: 40px;
   height: 40px;
   overflow: hidden;
   position: absolute;
   top: 10px;
   right: 10px;
   opacity: .6;
   cursor: pointer;
   z-index: 1001; }

span.rotator {
   display: block;
   width: 40px;
   height: 40px;
   position: absolute;
   top: 0;
   left: -20px;
   background: url(orbit/rotator-black.png) no-repeat;
   z-index: 3; }

span.mask {
   display: block;
   width: 20px;
   height: 40px;
   position: absolute;
   top: 0;
   right: 0;
   z-index: 2;
   overflow: hidden; }

span.rotator.move {
   left: 0 }

span.mask.move {
   width: 40px;
   left: 0;
   background: url(orbit/timer-black.png) repeat 0 0; }

span.pause {
   display: block;
   width: 40px;
   height: 40px;
   position: absolute;
   top: 0;
   left: 0;
   background: url(orbit/pause-black.png) no-repeat;
   z-index: 4;
   opacity: 0; }

span.pause.active {
   background: url(orbit/pause-black.png) no-repeat 0 -40px }

div.timer:hover span.pause,
span.pause.active {
   opacity: 1 }


/* CAPTIONS
  ================================================== */

.orbit-caption {
   display: none;
   font-family: "HelveticaNeue", "Helvetica-Neue", Helvetica, Arial, sans-serif; }

.orbit-wrapper .orbit-caption {
   background: #000;
   background: rgba(0,0,0,.6);
   z-index: 1000;
   color: #fff;
text-align: center;
padding: 7px 0;
   font-size: 13px;
   position: absolute;
   right: 0;
   bottom: 0;
   width: 100%;
min-height:400px;
overflow:hidden;}


/* DIRECTIONAL NAV
  ================================================== */

div.slider-nav {
   display: block }

div.slider-nav span {
   cursor: pointer;
   height: 50px;
   margin-top: -20px;
   position: absolute;
   text-indent: -9999px;
   top: 50%;
   width: 39px;
   z-index: 1000; }

div.slider-nav span.right {
   background: url(orbit/right-arrow.png);
   right: 0; }

div.slider-nav span.left {
   background: url(orbit/left-arrow.png);
   left: 0; }

/* BULLET NAV
  ================================================== */

.orbit-bullets {
   bottom: 0;
   list-style: none outside none;
   margin-left: -50px;
   padding: 0;
   position: absolute;
   right: 0;
   z-index: 1000; }

.orbit-bullets li {
   float: left;
   margin-left: 5px;
   cursor: pointer;
   color: #999;
   text-indent: -9999px;
   background: url(orbit/bullets.gif) no-repeat 0 0;
   width: 15px;
   height: 15px;
   overflow: hidden; }

.orbit-bullets li.active {
   color: #222;
   background-position: -15px 0; }

.orbit-bullets li.has-thumb {
   background: none;
   width: 100px;
   height: 75px; }

.orbit-bullets li.active.has-thumb {
   background-position: 0 0;
   border-top: 2px solid #000;
   }

#flash {
height: 400px;
/*margin: 20px 20px 20px 20px;*/
text-align: center;
display: block;
}
#home_featured {
height:400px;
overflow:hidden;
display: block;
}

 

Já tentei acertar, estudar o código, no dreamweaver não aparece essa linha pulada, Alguém pode me ajudar?

 

Esqueci de avisar, o local onde a linha é pulada é logo após a barra onde tem escrito Endereço - Telefone - Emails, era para essa barra ficar junto ao conteúdo seguinte, coladinho.

 

descobri que está aparecendo isso entre as divs

"

"

 

<div class="clear"></div>

<div style="width: auto; text-align: center; margin: auto; padding: 0pt; width: 740px; height: 400px;">

Compartilhar este post

Link para o post
Compartilhar em outros sites

William Bruno    1501

William Bruno
Postado

Remova essa DIV clear

 

         <div id="linha2" style="margin-top: 50px; text-align: center; line-height:12px; color:#DAC2CD;" class="rodape"> Endereço - Telefone - Emails
        </div>
        <div style="width: auto; text-align: center;  margin: auto; padding: 0pt; width: 740px; height: 400px;">

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