adicionar imgs

[Testinha 0]

Fala galera,

 

Sou iniciante na area de PHP e CSS e estou com uma dúvida que pode ser simples pra quem ja mexe faz algum tempo :P

 

Tirei algumas screens pra mostrar melhor oque eu quero...vamos la:

 

Eu estou fazendo a manutenção de um site em php...e tenho que adicionar uma imagem no rodapé da página, segue abaixo imagem de como esta atualmente e como tem que ficar:

 

Atual:

 

Como deve ser:

 

Eu tenho que colocar essa imagem do Brasil ao lado dessa Tour Latina, e essa tour latina esta como CSS, eu tentei fazer igual ta nela...mas nao deu muito certo, segue abaixo o codigo CSS dessa parte "Footer" e como ela é chamada na página php.

 

Código CSS:

 

Como é chamado no código:

 

A linha "#footer .brasil" foi a que eu tentei criar com a imagem...mas nao deu certo =//

 

Como eu teria que fazer pra colocar essa img do lado da azul do tour latina...ja tentei de tudo...o xxxxxx eh q nao pode ser pelo velho 'img src='...haha....tem q ser via css msm!!

 

Abraços!

:lol:

[Aprendiz CSS 3]

olá

 

dê uma lida neste artigo!

 

http://aprendacss.wordpress.com/2008/06/23...t-duas-colunas/

 

você precisa flutuar as imagens e verá que chega no resultado desejado!

 

evite colocar codigos em imagens dificulta quem for te ajudar!

 

utilize [ code ] e [ /code ] { sem espaço }

 

abraço

[Testinha 0]

Hmmm...

 

Eu coloquei float: left, q era pra ele ficar sobre os outros e alinhado a esquerda...mais qdo eu faço isso a img nao apareçe mais >.<

 

Abraços!

[Aprendiz CSS 3]

tem algum link!!!

 

isso não é comum!

 

abraço

[Testinha 0]

tem algum link!!!

 

isso não é comum!

 

abraço

link?? ^.-

 

Oq eu to tentando colocar é isso: <p class="brasil"><span>Brasil</span></p>

 

e eu queria que mostrasse isso: #footer .brasil {background: url(../_img/en-us/M_BRASIL_label_En.jpg) no-repeat; float: left; width: 50xp; height: 50px;}

 

Se eu tirar o float:left ela apareçe, mas apareçe assim:

 

Eu precisava deixar assim:

 

Mas como eu sou newbie em CSS eu não to conseguindo...hehe...ja tentei de td possivel...mas nao consigo =/

 

Abraços!

[William Bruno 1501]

Cara...é dificil apenas imaginarmos ou lermos pedaços do teu código.

Hospede em algum servidor, e coloque o link, para que vejamos o código inteiro.. pois o erro pode estar em outra parte... e não temos como adivinhar.

[Aprendiz CSS 3]

 

quando me referi a link, foi um link para poder visualizar o seu problema!

 

hehehe

 

faça assim

 

 

#footer p.brasil { background: transparent url(brasil.jpg) no-repeat left left; float: left; }
#footer p.outraimagem { background: transparent url(other.jpg) no-repeat left left; float: left; }

entendeu?

 

abraço

[Testinha 0]

Cara...é dificil apenas imaginarmos ou lermos pedaços do teu código.

Hospede em algum servidor, e coloque o link, para que vejamos o código inteiro.. pois o erro pode estar em outra parte... e não temos como adivinhar.

Fala uiLL,

 

o link do site é: http://www.tamvacations.com/

e o da css é: http://www.tamvacations.com/_css/en-us.css

 

 

quando me referi a link, foi um link para poder visualizar o seu problema!

 

hehehe

 

faça assim

 

 

#footer p.brasil { background: transparent url(brasil.jpg) no-repeat left left; float: left; }
#footer p.outraimagem { background: transparent url(other.jpg) no-repeat left left; float: left; }

entendeu?

 

abraço

Não entendi muito bem Aprendiz, tentei colocar esse código que você passou com o end correto da img e não funcionaou...

 

Abraços!

[Aprendiz CSS 3]

 

defina uma largura para o seu paragrafo!

 

e sua imagem é muito grande!

 

para usar com background, você não consegue redimensiona-la!

 

abraço

 

[Testinha 0]

para usar com background, você não consegue redimensiona-la!

Opa...isso eu não sabia...hehe

 

vou redimensionar no photoshop entao...e vou tentar fazer de novo...eh no margin q eu defino o paragrafo neh??

 

abraços!

[Aprendiz CSS 3]

Como assim é no margin que define o paragrafo?

não entendi!

abraço

[Testinha 0]

Como assim é no margin que define o paragrafo?

não entendi!

abraço

Fala Aprendiz,

 

dei umas fuçadas aqui e consegui fazer a imagem aparecer no tamanho certo, ja é um passo...hehe...porém ela esta aparecendo em posição errada, e ta aparecendo também o texto que tem entre os <span></span>...você sabe oq pode ser isso??

 

Abraços!

[Aprendiz CSS 3]

o span você pode dar um display: none

 

o posicionamento pode ser usado junto com o background assim oh

 

.brasil { background: cor url(imagem) repetição alinhamento-X alinhamento-Y;

traduzindo ficaria assim

 

.brasil { background: transparent url(brasil.jpg) no-repeat left center;

 

entendeu??

[Testinha 0]

o span você pode dar um display: none

 

o posicionamento pode ser usado junto com o background assim oh

 

.brasil { background: cor url(imagem) repetição alinhamento-X alinhamento-Y;

traduzindo ficaria assim

 

.brasil { background: transparent url(brasil.jpg) no-repeat left center;

 

entendeu??

Eu coloquei o display: none e nao adiantou

 

da uma olhada como ficou:

http://www.tamvacations.com/

 

Abraços!

[Testinha 0]

Eu só não to conseguindo entender, pq eu coloquei o dysplay: none, e o Brasil, que é oque ta escrito entre o <span></span> ainda aparece em cima da img, e a img parece que ta 1 linha acima das outras, ta assim atualmente:

 

 

mas deveria ficar assim:

 

 

Abraços!

[Aprendiz CSS 3]

Coloque o Brasil dentro de um span

 

e mande flutuar a esquerda a classe .brasil

 

creio que isso resolva o seu problema!

 

abraço

 

editado

 

após isso arrume os margins e paddings do elementos adjacentes!

 

abraço

[Testinha 0]

Coloque o Brasil dentro de um span

 

e mande flutuar a esquerda a classe .brasil

 

creio que isso resolva o seu problema!

 

abraço

 

editado

 

após isso arrume os margins e paddings do elementos adjacentes!

 

abraço

Agora consegui deixar aparecendo só a imagem, sem nada escrito em cima, o unico problema agora é que a img parece estar uma linha a cima das outras, eu tentei colocar margin-top: 0; mas nao adianta =//

 

abraços

[Aprendiz CSS 3]

aconselho a reescreer esse rodape!

 

ele não está semântico!

 

ficaria mais simples se o fizesse novamente, tem muita coisa desnecessária!

 

abraço

 

se tiver dúvida volta a postar!

 

abraço

[Testinha 0]

Fala Aprendiz,

 

Como assim semântico???? ^.-

 

sera q eu precisaria refazer só pra alinhar a img nova com as outras? =/

 

edit:

eh q nao fui eu q criei essa pagina...eu estou fazendo só a manutencão e aproveitando pra aprender esses tipos de detalhes, pra uma prox vez q eu tiver q fazer, nao ter esses problemas de novo!!

 

abraços

[brcontainer 16]

Bem quanto a semantica não vi problemas, porem para um rodapé simples não vejo necessidade de listas e titulos(h2,h5) a não ser que tenha haver com algo de indexação de sites (somente o H2 e H5), fora isso acredito tambem que o rodapé não necessitaria de tantas TAGs