Ir para conteúdo

POWERED BY:

Arquivado

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

regina

[Resolvido] Posicionamento errado de 1 div

Por , em Desenvolvimento frontend

Recommended Posts

regina    0

regina
Postado

Bom dia,

 

estou desenvolvendo um projeto e nele tenho um banner animado por jquery bxSlider.

O problema é que algo está acontecendo de errado no layout da div do banner

layout_fire.jpg

Como podem ver na imagem, a imagem não fica bem posicionada na div #banner, as bordas da div .slides-banner ficam empurrando a imagem para baixo.

 

Tenho pouca experiência por isso solicito o auxílio de vocês.

 

Vamos ao código

<body>

<div id="geral">

<?php include_once("configuracoes/funcoes_php.php");

include_once("configuracoes/topo.php"); ?>

<div id="banner">

<div class="slides-banner"><div style="width:100%;position:relative;margin:0;overflow:hidden" class="bxslider_container">

<ul id="slides-banner">

<?php $sql_img=mysql_query("SELECT tb_produtos.produto_id,tb_produtos.imagem as imagem_produto,tb_produtos.produto,tb_produtos_banner.imagem_id,tb_produtos_banner.imagem FROM tb_produtos INNER JOIN tb_produtos_banner ON tb_produtos.produto_id=tb_produtos_banner.produto_id ORDER BY RAND() LIMIT 5") or die (mysql_error());

if(mysql_num_rows($sql_img)!=0) {?>

<?php while($row=mysql_fetch_array($sql_img)){?>

<li><a href="#"><img src="<?php print $path;?>/imagens/banner/<?php print $row["imagem"];?>" alt="<?php print $row["oferta"];?>" title="<?php print $row["oferta"];?>"/></a>

</li>

<?php } #while

} #if?>

</ul>

</div>

</div><!-- slides-banner -->

</div><!-- banner -->

<div id="categorias">

<ul>

<li class="light"><h1>Teste 1</h1></li>

<li class="dark"><h1>Teste 2</h1></li>

<li class="light"><h1>Teste 3</h1></li>

<li class="dark"><h1>Teste 4</h1></li>

</ul>

</div><!-- categorias -->

CSS

body{background:#000;font:normal 14px "Lucida Sans Unicode", "Lucida Grande", sans-serif}

#geral{width:980px;height:410px;height:auto !important;min-height:410px;margin:0 auto;background:none}

/*CONTEÚDO*/

#conteudo{width:100%;height:410px;height:auto !important;min-height:410px;margin:0;background:#FFF}

/*banner*/

#banner{width:980px;height:310px;margin:5px 0 0 0;background-color:#FFF;border:solid 1px #99CC00}

.slides-banner {width:980px;height:310px;padding:0;margin:0;border:solid 1px #FFCC00}/*div anterior a ul*/

#slides-banner {height:980px;overflow:hidden}/*ul*/

#slides-banner .slide-content {width:980px;height:310px;margin:0}

#slides-banner li {width:980px;margin-left:2px}

/* categorias inicial */

#categorias{width:100%;height:200px;margin:10px 0 0 0;font:bold 14px;color:#000;background:#FFF}

#categorias h1{line-height:30px;text-align:center;font:bold 14px;margin:0;color:#FFF;clear:left;background:#A8252A;text-transform:uppercase}

#categorias ul {margin:5px 0;padding:0;list-style:none;white-space:normal}

#categorias ul li {width:242px;height:150px;display:inline-block;padding:0;background:none;vertical-align:top}

Compartilhar este post

Link para o post
Compartilhar em outros sites

regina    0

regina
Postado

Tentei, tentei e tentei e parece que agora funcionou:

 

.slides-banner {width:980px;position:relative;padding:1px 0 0 0;margin:-15px 0 0 0}/*div anterior a ul*/

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