Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> odsyłanie do linku po kliknięciu w element tła
kaizen
post 7.09.2011, 14:12:46
Post #1





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 7.09.2011

Ostrzeżenie: (0%)
-----


Witam,

Mam pytanie.

Stworzyłem sobie listę "marzeń", które chce zrealizować. Lista dostępna jest tutaj: http://tojakaizen.pl/moje-marzenia

Niektóre z napisów są odsyłaczami. Chciałbym zrobić tak, że nie potrzeba klikać dokładnie w napis, aby przenieść się do kolejnej strony. Wystarczyłoby aby kliknąć w tło (w dowolne miejsce na prostokącie). Czy może mi ktoś pomóc jak to zrobić?


kod css strony:
  1. /* Dreams ------------------------------*/
  2.  
  3. .dream {
  4. padding: 4px 5% 4px 5%;
  5. font-family: Georgia, "Times New Roman", Times, serif;
  6. text-align: center;
  7. margin: 0 0 2px 0;
  8. }
  9.  
  10. .dream.white {
  11. background: #fff;
  12. border-top: 1px solid #e4e4e4;
  13. border-bottom: 1px solid #e4e4e4;
  14. color: #444444;
  15. }
  16.  
  17. .dream.white:hover{
  18. color:#3B3B3B;
  19. background: #F0F0F0;
  20. }
  21.  
  22. .dream.white a {
  23. color:#444444;
  24. text-decoration:underline;
  25. }
  26.  
  27. .dream.green {
  28. background: #D5FFCA;
  29. border-top: 1px solid #cadba7;
  30. border-bottom: 1px solid #cadba7;
  31. color: #5f8b33;
  32. }
  33.  
  34. .dream.green:hover{
  35. color:#5C8B2E;
  36. background: #C8FEBA;
  37. }
  38.  
  39. .dream.green a {
  40. color:#5f8b33;
  41. text-decoration:underline;
  42. }
Go to the top of the page
+Quote Post
kamil4u
post 7.09.2011, 14:20:17
Post #2





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

Ostrzeżenie: (0%)
-----


Trochę by trzeba było poprawiać smile.gif
Najważniejsze jest nadanie <a> w CSS display: block; to generalnie załatwia sprawę, ale w swoim kodzie masz ustawiony padding na <div>-ach, który trochę psuje cały efekt - usuń go.

I w tym przypadku kod HTML powinien być listą: <ul>, <li> + odpowiednie ostylowanie CSS

--edit--
Ew. możesz dodać dla <a> width: 100%; hieght: 100%;

Ten post edytował kamil4u 7.09.2011, 14:23:05


--------------------
Go to the top of the page
+Quote Post
kaizen
post 8.09.2011, 17:11:03
Post #3





Grupa: Zarejestrowani
Postów: 2
Pomógł: 0
Dołączył: 7.09.2011

Ostrzeżenie: (0%)
-----


Dzięki wielkie za pomoc, twoje rady były bardzo użyteczne. Uzyskałem rezultat o, który mi chodziło

Teraz tylko muszę się zastanowić jak wyróżnić teksty, które mają odnośnik od tych które go nie mają. Żeby użytkownicy wiedzieli, że niektóre punkty z listy prowadzą dalej biggrin.gif

Ten post edytował kaizen 8.09.2011, 17:17:26
Go to the top of the page
+Quote Post

Reply to this topicStart new topic
1 Użytkowników czyta ten temat (1 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Wersja Lo-Fi Aktualny czas: 14.08.2025 - 05:01