Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Biala Linia
Forum PHP.pl > Forum > Przedszkole
_MaStErCoBrA_
Witam, mam menu na stronie ktore wyglada tak:

  1. <div id="mainmenu"><ul>
  2. <li class="notactive">Step 1</li>
  3. <li class="active">Step 2</li>
  4. <li class="notactive">Step 3</li>
  5. <li class="notactive">Step 4</li>
  6. <li class="notactive">Step 5</li>
  7. </ul></div>


Co daje nam:

http://img83.imageshack.us/my.php?image=82408922be6.jpg

Chce dodac linka do guzika "Step 3", w ten sposob:

  1. <div id="mainmenu"><ul>
  2. <li class="notactive">Step 1</li>
  3. <li class="active">Step 2</li>
  4. <a href="index.php?id=top"><li class="notactive">Step 3</li></a>
  5. <li class="notactive">Step 4</li>
  6. <li class="notactive">Step 5</li>
  7. </ul></div>


I dostajemy biala linie pod guzikami ktora oddziela je od paska:

http://img264.imageshack.us/img264/1538/82972232sg6.jpg

---

CSS:

mainmenu:

  1. #mainmenu {
  2. height:26px;
  3. }
  4.  
  5. #mainmenu ul {
  6. list-style-type:none;
  7. float:left;
  8. margin:0;
  9. }
  10.  
  11. #mainmenu li {
  12. width:100px;
  13. text-align:center;
  14. line-height:26px;
  15. display:block;
  16. float:left;
  17. margin-right: 17px;
  18. }
  19.  
  20. #mainmenu li.active {
  21. background-image:url(images/tab_active_fo.gif);
  22. font-weight: bold;
  23. color: white;
  24. }
  25.  
  26. #mainmenu li.notactive {
  27. background-image:url(images/tab_inactive.gif);
  28. font-weight: bold;
  29. }
  30.  
  31. #mainmenu li a {
  32. text-decoration:none;
  33. font-size:12px;
  34. font-weight:bold;
  35. }
  36.  
  37. #mainmenu li.active a {
  38. color:white;
  39. }
  40.  
  41. #mainmenu li.notactive a {
  42. color:#808080;
  43. }


Co robic ? sad.gif

Dziekuje i pozdrawiam smile.gif
Shili
Po pierwsze jeśli już to nie:
  1. <a href="index.php?id=top"><li class="notactive">Step 3</li></a>

a
  1. <li class="notactive"><a href="index.php?id=top">Step 3</a></li>

Po to masz style, żeby to wystylować na 100% wysokości i szerokości. Prawdopodobnie powinno problem rozwiązać.
_MaStErCoBrA_
Ale dzieje sie to dopieor po tym jak dodam linki do tego menu, wlasnie te o ktorych mowa wyzej. Jaki to ma na to wplyw ?
Shili
Nie wiem jaki ma wpływ, bo podałeś obrazki, a nie stronę i nie mogę sama optymalnie sprawdzić (z obrazków tła wycinać nie będę, żeby to wyglądało jak mające ręce i nogi).

Zwracam Ci tylko uwagę, że masz złą kolejność elementów. A jest elementem liniowym, li - blokowym. Element liniowy nie może zawierać w sobie elementów blokowych, czyli nie <a><li></li><a>, a <li><a></a></li>
Na razie tworzysz niepoprawny kod - popraw go odpowiednio, a jeśli problem nadal będzie występował, to poszuka się bardziej ukrytych błędów.
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.