Margem grande e hover em botão

[BrunoT]

Boa Tarde,

Mais uma vez preciso da vossa ajuda para algo que penso que se resolve facilmente. São dois problemas que tenho, não sei se estou a infrigir alguma regra, isto é, se sou obrigado a por os problemas em tópicos separados.

O site é este: http://www.foodmoods.org/launch/

O primeiro problema reside naquele espaço enorme em branco entre o formulário da newsletter e o icon. Eu consigo resolver pondo o icon e o resto das coisas com position: relative e por o top a negativo, mas queria perceber porque é que isto acontece e como resolver de uma forma mais "normal".

O outro problema é que queria por outra imagem quando o rato fica hover nas setas do slide e nos icons de facebook/twitter. Já tentei com a propriedade :hover do css, mas as imagens "novas" fica por baixo das outras e assim não se consegue ver as imagens.

Obrigado

[HappyHippyHippo]

não estou a perceber que a que icon te referes, só existe uma caixa de texto e um botão, de icon : nada

que código estás a usar para trocar as imagens ? é que se aparece por baixo, então estás a usar a propriedade :hover nos componentes errados.

[BrunoT]

Se puxares a página para baixo vês ao que me refiro 😉

Quanto ao "hover" vou voltar a por como tinha para ser mais fácil veres.

Obrigado, és sempre tu a salvar-me 😉

[HappyHippyHippo]

Se puxares a página para baixo vês ao que me refiro 😉

Quanto ao "hover" vou voltar a por como tinha para ser mais fácil veres.

Obrigado, és sempre tu a salvar-me 😉

eu puxei a página para baixo ...

só tem uma imagem do lado esquerdo, texto no meio, e lixo no lado direito. a separa tem uma imagem desnecessariamente grande com 1352px de largura !!!

[BrunoT]

Não vês algo assim ?

http://www.foodmoods.org/launch/shot.png

Se não vês, então o problema é muito mais grave do que o que eu pensava ...

[Th3Alchemist]

Tipo adicionares isto?

#line {
  height: 100px;
}

[HappyHippyHippo]

Tipo adicionares isto?

#line {
  height: 100px;
}

isso resolveria se ele não tivesse um elemento escondido que irá aparecer em cima de tudo quando fizeres o registo na newsletter

o layout deveria ser TODO reformulado

este são os casos mais gritantes no css:

- usar o "position: absolute" só em casos mesmo necessários

- nunca usar um tag <img> para fazer de background

- uma linha pode ser feita com css, sem uso a uma imagem

[BrunoT]

isso resolveria se ele não tivesse um elemento escondido que irá aparecer em cima de tudo quando fizeres o registo na newsletter

o layout deveria ser TODO reformulado

este são os casos mais gritantes no css:

- usar o "position: absolute" só em casos mesmo necessários

- nunca usar um tag <img> para fazer de background

- uma linha pode ser feita com css, sem uso a uma imagem

É o que irei fazer. Como faço para por a imagem em background sem usar a tag img ?

[HappyHippyHippo]

#id {
 background-image: url("imagens/bg.png");
}

notas

- existem muitos mais parâmetros para o background : https://developer.mozilla.org/en-US/docs/CSS/background

- o caminho é relativo ao ficheiro de css

Edited February 20, 2013 at 11:41 AM by HappyHippyHippo

[BrunoT]

Obrigado aos dois 🙂 Não tenho muita noção do standard em linguagens web e então cometo erros destes.