Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: Menu CSS
Forum PHP.pl > Forum > Po stronie przeglądarki > CSS
kopendrex
24.03.2006, 15:59:36
Witam wymeczylem dzis menu, ale mam problem z IE tj dodaje jakies mi odstepy pomiedzy <li> w <ul class='pion'> wie ktos moze co z tym zrobic?:
Kod
<link rel="stylesheet" href="test.css" type="text/css" />
<div id="MenuModele">
<ul id="Menu">
  <li><a href="" class='a0'>Modele</a>
   <ul class='pion'>
    <li><a href="" class='a1'>Osobowe</a>
     <ul>
      <li><a href="" class='a2'>Jeden</a></li>
      <li><a href="" class='a2'>Dwa</a></li>
      <li><a href="" class='a2'>Trzy</a></li>
     </ul>
    </li>
    <li><a href="" class='a1'>4x4</a></a>
     <ul>
      <li><a href="" class='a2'>Jeden</a></li>
      <li><a href="" class='a2'>Dwa</a></li>
      <li><a href="" class='a2'>Trzy</a></li>
     </ul>
    </li>
    <li><a href="" class='a1'>Dostawcze</a>
     <ul>
      <li><a href="" class='a2'>Jeden</a></li>
      <li><a href="" class='a2'>Dwa</a></li>
      <li><a href="" class='a2'>Trzy</a></li>
     </ul>
    </li>
   </ul>
  </li>
</ul>
</div>

[HTML] pobierz, plaintext 
  1. body {
  2. margin: 0px;
  3. padding: 0px;
  4. text-align: left;
  5. font-family: Verdana, Helvetica, Arial;
  6. font-size: 10px;
  7. color: #666666;
  8. behavior:url("csshover.htc");
  9. }
  10. #MenuModele {
  11. width: 110px;
  12. }
  13. #MenuModele ul {
  14. list-style: none;
  15. margin: 0px;
  16. padding: 0px;
  17. }
  18. #Menu a.a0,#Menu a.a1,#Menu a.a2 {
  19. display: block;
  20. font-size: 10px;
  21. font-weight: bold;
  22. text-decoration: none;
  23. color: #000000;
  24. margin: 0px;
  25. padding: 0px;
  26. }
  27. #MenuModele a:hover {
  28. color: #ff00ff;
  29. }
  30. #MenuModele li {
  31. position: relative;
  32. }
  33. #MenuModele ul.pion {
  34. position: absolute;
  35. left: 0px;
  36. top: 20px;
  37. }
  38. #MenuModele ul ul ul {
  39. position: absolute;
  40. left: 110px;
  41. top: 0px;
  42. }
  43. a.a0 {
  44. background-color: #bdbdbd;
  45. width: 110px;
  46. height: 20px;
  47. }
  48. a.a1 {
  49. background-color: #adadad;
  50. width: 110px;
  51. height: 20px;
  52. }
  53. a.a2 {
  54. background-color: #dadada;
  55. width: 110px;
  56. height: 20px;
  57. }
  58. div#MenuModele ul ul.pion li,
  59. div#MenuModele ul ul.pion ul {
  60. display: none;
  61. }
  62. div#MenuModele ul li:hover ul.pion li,
  63. div#MenuModele ul ul.pion li:hover ul {
  64. display: block;
  65. }
[HTML] pobierz, plaintext
rbart
24.03.2006, 19:15:10
Kod który wpisałeś mi pod IE (v 6.0) wogóle nie działa

ale możesz spróbować ustawić wartości margin i padding dla elementów li oraz ul w clasie pion z tego co napisałeś to powinno rozwiązać problem (tylko moje domysły).
gekon
25.03.2006, 13:42:29
http://riddle.jogger.pl/2005/12/12/dziwactwa-ie-listy/
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.