Imagem no lado da imagem

[italogabriel 0]

http://www.imagemhost.net/qtc

 

Bom ta ficando assim kk, nenhum tutorial que achei me ajudou, ta foda :s, lá vem eu encher o saco denovo... rsrs vou entrar em um curso, só que até lá... eaheuh, vou postar o código

 

HTML

 

<div id="loja">
 <h1>MAPA DA LOJA</h1>
<img src="images/mcabof.jpg" width="266" height="198" />
<p>CABO FRIO
Rua Raul Veiga, 389 Loja16 Centro - Cabo Frio
</p>
</div>
<div id="clear"></div>
</div>

 

 

 

CSS

 

/* ------------------------------

LOJA CSS

------------------------------ */

#loja {width:950px; margin:20px auto 80px;}

#loja h1 {font-family:"AaarghNormal", Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:16px; color:#341b04; width:950px; border-bottom:1px solid #351b04; margin-bottom: 34px;}

img {float:left;}

p {font-size:12px; font-family:Verdana, Geneva, Arial, sans-serif; text-align:justify;}

Espero que possam me ajudar, ficarei grato novamente *-*

[Web_avallon 5]

Amigão, eu não entendi no que você quer ajuda '-' kkkkkkkkkkk

[italogabriel 0]

o posicionamento das informações, como cabo frio e etc.. tudo um em baixo do outro, afastado da img < tudo bem bonitinho rssr

[Web_avallon 5]

Poste o código aqui amigão. Mas deixe-me ver se compreendi, você quer que as informações fiquem uma embaixo da outra e fiquem à direita da imagem, certo?

[WBS DIGITAL 6]

basta dar float e margin para a imagem e para quebrar as linhas do texto, dê um <br> onde deseja mandar para baixo

[italogabriel 0]

Poste o código aqui amigão. Mas deixe-me ver se compreendi, você quer que as informações fiquem uma embaixo da outra e fiquem à direita da imagem, certo?

isso mesmo!

[Web_avallon 5]

Dê um float: left na imagem e coloque as informações em uma lista não ordenada.

Dê uma margin-left na lista ou um margin-right na imagem. Procure colocar uma borda provisória na lista, pra poder se basear - depois que alinhar tudo certinho pode tirá-la.

 

Mas caso não tenha entendido, poste o código parceiro.

[italogabriel 0]

Dê um float: left na imagem e coloque as informações em uma lista não ordenada.

Dê uma margin-left na lista ou um margin-right na imagem. Procure colocar uma borda provisória na lista, pra poder se basear - depois que alinhar tudo certinho pode tirá-la.

 

Mas caso não tenha entendido, poste o código parceiro.

Não funcionou, ainda fica tudo colado,

 

HTML

<div id="loja">

<h1>LOJAS</h1>

<img src="images/mcabof.jpg" width="266" height="198" />

<p>CABO FRIO<br />

Rua Raul Veiga, 389 Loja16 Centro - Cabo Frio

</p>

</div>

<div id="clear"></div>

</div>

 

CSS

/* ------------------------------

LOJA CSS

------------------------------ */

#loja {width:950px; margin:20px auto 80px;}

#loja h1 {font-family:"AaarghNormal", Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:16px; color:#341b04; width:950px; border-bottom:1px solid #351b04; margin-bottom: 34px;}

img {float:left;}

p {margin-right:20px; font-family:Verdana, Geneva, Arial, sans-serif;}

ta foda :ss, olha um print - http://www.imagemhost.net/Qtc.jpg

"Clique no link para visualizar a imagem"

[italogabriel 0]

Fala ai pessoal :D, fiz um grande avanço! observem na img

 

http://www.imagemhost.net/pvc.jpg

 

Só que eu queria esse icarai um pouco mais perto, já tentei usar margin-left:-NÚMEROpx; e não funcionou ://

 

CSS

 

/* ------------------------------
LOJA CSS
------------------------------ */
#loja {width:950px; margin:20px auto 80px;}
#loja h1 {font-family:"AaarghNormal", Arial, Helvetica, sans-serif; text-transform:uppercase; font-size:16px; color:#341b04; width:950px; border-bottom:1px solid #351b04; margin-bottom: 34px;}
#loja h2 {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:20px; color:#341b04; margin-left:10px;}
span.text {font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:15px; color:#000; margin-left:20px;}

 

 

HTML

 

 

<div id="loja">
 <h1>LOJAS</h1>
<h2>CABO FRIO</h2>
<span class="text">Endereço: Rua Raul Veiga, 389 Loja16 Centro - Cabo Frio</span><br />
<span class="text">Telefone: (22) 2643-5268</span><br />
<span class="text">Funcionamento: Seg. - Sab.: 10:00 - 20:00</span><br />
<span class="text">Email: gerencia@alegale.com.br</span>
<br />
<br />
<div style="float:right; margin-top:-126px;"><h2>ICARAÍ</h2>
<span class="text">Endereço: XXXXXXXXXXXXXXXXXX - XXXXXX</span><br />
<span class="text">Telefone: (XX) XXXX-XXXXX</span><br />
<span class="text">Funcionamento: Seg. - Sab.: XX:XX - XX:XX</span><br />
<span class="text">Email: XXXXXXXXXXXXX</span></div>
<div id="clear"></div>
</div>

 

 

 

a, se tiverem como resolver esse footer também, fico agradecido!

[Henrique Werlang 8]

ja que esta em float right a coluna a direita, use margin-right: valor;

[italogabriel 0]

ja que esta em float right a coluna a direita, use margin-right: valor;

<div style="float:right; margin-top:-126px; margin-right:500px;">

 

Não funcionou :// já tentei isso, nem se meche o bang kk

 

Esqueçam o problema do rodapé :D, resolvi seguindo este tutorial! http://maujor.com/tutorial/rodape-embaixo-da-janela.php

 

ja que esta em float right a coluna a direita, use margin-right: valor;

estranho, antes não havia funcionado e agora está funcionando o.O, muito obrigado :D

 

-----------------------------------------------------

 

Algum moderador feche o tópico por favor! todos me ajudaram e não tenho como marca somente 1 como resolvido, seria egoísta da minha parte.