Ir para conteúdo

POWERED BY:

Arquivado

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

criativacriações

Colocando uma imagem embaixo da outra

Por , em Desenvolvimento frontend

Recommended Posts

Nícolas Luís Huber    14

Nícolas Luís Huber
Postado

Olá Seja bem vindo ao Fórum iMasters. Para poder lhe ajudar melhor eu preciso saber como está seu código, ou se você ja tem o arquivo hospedado. Assim posso analisar o código para podermos discutir a solução.

 

:seta: http://forum.imasters.com.br/topic/212439-como-criar-um-topico-para-o-seu-problema/

Compartilhar este post

Link para o post
Compartilhar em outros sites

criativacriações    0

criativacriações
Postado

dá uma olhada:

 

HTML

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url=http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd [/url]">
<html xmlns="[url=http://www.w3.org/1999/xhtml]http://www.w3.org/1999/xhtml [/url]">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="tudo">
<div id="topo">

    <div id="logo">
    <img src="img/logo.jpg" alt="LocFuros Serviçoc Ltda." />
    </div>
    
    <div id="endereco">
    <p><b>LocFuros Serviços Ltda</b></b>
    <p>Av. Bra. Mesquita, 214 - Cosmorama
    Mesquita - RJ, 26582-000</p>
    </div>

</div>

<div id="menu">
    <div id="dentromenu">
    
    <a href="index.html" class="links"><b> HOME</b></a>
    <a href="furosecortes.html" class="links"> <b>FUROS E CORTES</b></a>
    <a href="locacao.html" class="links"> <b>LOCAÇAO</b></a>
    <a href="especao.html" class="links"> <b>INSPEÇÃO</b></a>
    <a href="venda.html" class="links"> <b>VENDAS</b></a>
    <a href="contato.html" class="links"> <b>CONTATO</b></a>
    </div>    

</div>
<div id="baixo">
    <div id="conteudo">
        <div id="img1">
        </div>
        <div id="img2">
        </div>
        <div id="img3">
        </div>
    </div>
</div>

<div id="rodape">
<p>LOCFUROS SERVIÇOS LTDA - Copyright © 2013 - <a href="www.criativacriacoes.com.br"> Criativa Criações</a> - Desenvolvido por Ana Beatriz Souza</p>
</div>



</div>
</body>
</html>

 

 

 

CSS

 

* {
    margin:0;
    padding:10;
}

#tudo{
width:100%;/*largura do site*/
height:auto;/*altura automática*/
display:table;/*se comporta como uma tabela*/
margin:auto;
font-family:Verdana, Geneva, sans-serif;
}

#topo{
width:100%;
height:200px;
background-color:#FFF;    
}

#logo{
width:900px;
height:100px;
margin: 0 auto;
padding-top:20px;
    
}

#endereco{
width:200px;
height:200px;
float:right;
color:#000033;
margin: 0 auto;

    

}

#menu{
width:100%;
height:40px;
background-image:url(../img/bgmenu.jpg);
background-repeat:repeat-x;
margin-top:20px;
}

#dentromenu{
width:900px;
height:30px;
margin: 0 auto;
padding-top:10px;

}

.links {
color:#000033;
font-family:Arial, Helvetica, sans-serif;
font-size:15px;
text-decoration:none;    
padding:15px;

}

.links:hover{
background-color:#FFF;
background-repeat:repeat-x;
padding:15px;
}

#baixo{
width:100%;
height:720px;
background-image:url(../img/bgconteudo.jpg);
background-repeat:repeat-x;
}

#conteudo{
width:880px;
height:680px;
background-image:url(../img/bgcima.jpg);
margin:0 auto;
padding:20px 20px 0px 0px;
}

#rodape{
width:100%;
height:40px;
background-color:#000033;
text-align:center;
padding-top:10px;
    
}

#rodape p{
font-family:Verdana, Geneva, sans-serif;
font-size:15px;
color:#FFF;
}

a{
    
text-decoration:none;
color:#FFF;

}

#img1{
width:200px;
height:200px;
background-color:#900;
border:#FCFCFC solid 5px;
float:right;


}

 

Compartilhar este post

Link para o post
Compartilhar em outros sites

Giovanni Petris    0

Giovanni Petris
Postado 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "[url=http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd]http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd   [/url]">
<html xmlns="[url=http://www.w3.org/1999/xhtml]http://www.w3.org/1999/xhtml   [/url]">
<head>
<style type="text/css">
 .block {
  display: block;
 }
</style>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="tudo">
<div id="topo">

    <div id="logo">
    <img src="img/logo.jpg" alt="LocFuros Serviçoc Ltda." />
    </div>
    
    <div id="endereco">
    <p><b>LocFuros Serviços Ltda</b></b>
    <p>Av. Bra. Mesquita, 214 - Cosmorama
    Mesquita - RJ, 26582-000</p>
    </div>

</div>

<div id="menu">
    <div id="dentromenu">
    
    <a href="index.html" class="links"><b> HOME</b></a>
    <a href="furosecortes.html" class="links"> <b>FUROS E CORTES</b></a>
    <a href="locacao.html" class="links"> <b>LOCAÇAO</b></a>
    <a href="especao.html" class="links"> <b>INSPEÇÃO</b></a>
    <a href="venda.html" class="links"> <b>VENDAS</b></a>
    <a href="contato.html" class="links"> <b>CONTATO</b></a>
    </div>    

</div>
<div id="baixo">
    <div id="conteudo">
        <div id="img1" class="block">
        </div>
        <div id="img2" class="block">
        </div>
        <div id="img3" class="block">
        </div>
    </div>
</div>

<div id="rodape">
<p>LOCFUROS SERVIÇOS LTDA - Copyright © 2013 - <a href="www.criativacriacoes.com.br"> Criativa Criações</a> - Desenvolvido por Ana Beatriz Souza</p>
</div>



</div>
</body>
</html>

 

 

Olá, desenvolvi um css'zinho pra você, teste o código postado e informe se isso resolveu seu problema.

Compartilhar este post

Link para o post
Compartilhar em outros sites

JP_xD    0

JP_xD
Postado

tenta colocar position:absolute nas imagens e para deixalas uma em baixo da outra trata com z-index, quanto maior o z-index ele fica por cima

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