texto linkado ficar sublinhado

[Hada 0]

Olá pessoal,

Estou com duas dúvidas, segue logo abaixo:

 

1- Tenho uma imagem, e abaixo da imagem (<br />), tenho um texto (hada), com um link (<a>#</a>), com base nisso gostaria de saber como faço para quando alguém dá um hover na imagem, o texto linkado ficar sublinhado, como se estivesse dado um hover no texto também. ;D

 

PS: A imagem também está com um link.

 

2- Tenho um bloco (div) com 60px de width, tenho um texto dentro desse bloco, o texto é grande demais, e não contém espaços, por isso ele aumenta o width do bloco, pra ficar de acordo com o width do texto. Gostaria de saber como faço para que esse texto quebre quando for passar dos 60px de width.

 

PS: Este texto está centralizado.

 

* Escrevi as duas dúvidas rapidamente, por que estou de saída, então quem não entender nada, responde no tópico informando que eu explico novamente, abraços.

[William Bruno 1501]

1- você pode usar Javascript. No teu caso, acho que é realmente a melhor solução.

A outra seria, fazer a imagem e o texto serem o mesmo <a>.. ai, você configuraria o text-decoration, para underline no estado hover.

 

2- Texto grande sem espaços.. realmente é necessário pensar nisso ?

http://krijnhoetmer.nl/stuff/css/word-wrap-break-word/

Não conheço nenhuma forma de fazer isso crossbrowser.

Geralmente, evitam que o layout quebre por causa disso, usando overflow: hidden(esconder oq passar).