Drukowana wersja tematu

Kliknij tu, aby zobaczyć temat w orginalnym formacie

Forum PHP.pl _ HTML \ XHTML _ Pozycjonowanie elementów

Napisany przez: zbbspuug 29.03.2016, 18:05:06

Witam, mam problem z wy pozycjonowaniem elementów znaczników ul li.

https://jsfiddle.net/s6hkkfa5/

Jak zrobić aby po najechaniu na Nav #2, Nav #3, Nav #4 elementy wyświetlały się rozpoczynając od wysokości Nav #1 w dół ?

  1. <http://december.com/html/4/element/html.html>
  2. <http://december.com/html/4/element/head.html>
  3. <http://december.com/html/4/element/style.html type="text/css">
  4. nav { width: 225px; margin: 0 auto; }
  5. ul { list-style: none; }
  6. ul > li { }
  7. ul > li > ul { display: none; }
  8. ul > li:hover > ul { display: block; float: right; position: relative; }
  9. ul > li > ul > li { }
  10. </http://december.com/html/4/element/style.html>
  11. </http://december.com/html/4/element/head.html>
  12. <http://december.com/html/4/element/body.html>
  13. <nav>
  14. <http://december.com/html/4/element/ul.html>
  15. <http://december.com/html/4/element/li.html>Nav #1
  16. <http://december.com/html/4/element/ul.html>
  17. <http://december.com/html/4/element/li.html>SubNav #1.1</http://december.com/html/4/element/li.html>
  18. </http://december.com/html/4/element/ul.html>
  19. </http://december.com/html/4/element/li.html>
  20. <http://december.com/html/4/element/li.html>Nav #2
  21. <http://december.com/html/4/element/ul.html>
  22. <http://december.com/html/4/element/li.html>SubNav #2.1</http://december.com/html/4/element/li.html>
  23. <http://december.com/html/4/element/li.html>SubNav #2.2</http://december.com/html/4/element/li.html>
  24. </http://december.com/html/4/element/ul.html>
  25. </http://december.com/html/4/element/li.html>
  26. <http://december.com/html/4/element/li.html>Nav #3
  27. <http://december.com/html/4/element/ul.html>
  28. <http://december.com/html/4/element/li.html>SubNav #3.1</http://december.com/html/4/element/li.html>
  29. <http://december.com/html/4/element/li.html>SubNav #3.2</http://december.com/html/4/element/li.html>
  30. <http://december.com/html/4/element/li.html>SubNav #3.3</http://december.com/html/4/element/li.html>
  31. </http://december.com/html/4/element/ul.html>
  32. </http://december.com/html/4/element/li.html>
  33. <http://december.com/html/4/element/li.html>Nav #4
  34. <http://december.com/html/4/element/ul.html>
  35. <http://december.com/html/4/element/li.html>SubNav #4.1</http://december.com/html/4/element/li.html>
  36. <http://december.com/html/4/element/li.html>SubNav #4.2</http://december.com/html/4/element/li.html>
  37. <http://december.com/html/4/element/li.html>SubNav #4.3</http://december.com/html/4/element/li.html>
  38. <http://december.com/html/4/element/li.html>SubNav #4.3</http://december.com/html/4/element/li.html>
  39. </http://december.com/html/4/element/ul.html>
  40. </http://december.com/html/4/element/li.html>
  41. </http://december.com/html/4/element/ul.html>
  42. </nav>
  43. </http://december.com/html/4/element/body.html>

Napisany przez: koodo218 29.03.2016, 18:59:28

https://jsfiddle.net/koodo218/s6hkkfa5/2/

Napisany przez: zbbspuug 29.03.2016, 19:45:39

A czy jest możliwość ustawić to tak aby nie trzeba było przypisywać stałych wartości "Right" i "Top", tak aby wraz z dodawaniem "<li>" powiększało się tło pod menu ?

https://jsfiddle.net/s6hkkfa5/5/

Powered by Invision Power Board (http://www.invisionboard.com)
© Invision Power Services (http://www.invisionpower.com)