Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS]Jak zmienić tryb przycisk by się nie przesuwał
Forum PHP.pl > Forum > Przedszkole
Darek82
Mam na stronie przyciski u góry, dałem że po najechaniu tekst ma być bold ale nie chce by się przesuwały te przyciski jak moge to zmienić

  1. #top ul {
  2. list-style:none;
  3. margin:0px;
  4. padding:0px;
  5. position:absolute;
  6. top:10px;
  7. left:200px;
  8. }
  9.  
  10. #top ul li {
  11. display:inline;
  12. float:left;
  13. background: url(../images/button_active.png) no-repeat center right ;
  14. height:36px;
  15. margin:0px 10px;
  16.  
  17. }
  18.  
  19. #top ul a:link, #top ul a:visited {
  20. background: url(../images/left_button_active.png) no-repeat left ;
  21. height:36px;
  22. float:left;
  23. text-decoration:none;
  24. text-align:center;
  25. padding: 0px 5px 0px 5px;
  26. line-height:36px;
  27.  
  28. }
  29.  
  30.  
  31. #top ul a:hover {
  32. font-weight:bold;
  33.  
  34. }
iro88
Ostatnio się bawiłem w coś podobnego, z tą różnicą, że po najechaniu tekst zmienia wielkość. Mój fragment css, choć jeszcze jest do drobnej poprawki, poniżej:
  1. #menu ul {
  2. display: block;
  3. list-style: none;
  4. width: 380px;
  5. margin-top: 26px;
  6. margin-left: auto;
  7. margin-right: auto;
  8. margin-bottom: 5px;
  9. padding: 0;
  10. font-size: 20px;
  11. }
  12.  
  13. #menu ul:hover {
  14. margin-top: 20px;
  15. margin-bottom: 3px;
  16. width: 395px;
  17. }
  18.  
  19. #menu ul li {
  20. display: inline;
  21. list-style: none;
  22. margin: 0;
  23. padding: 25px 30px;
  24. white-space: nowrap;
  25. }
  26.  
  27. #menu ul li:hover {
  28. font-size: 26px;
  29. padding: 25px 18px 25px 23px;
  30. margin-bottom: 0;
  31. }


Dopasuj u siebie marginesy. Działa to tak, że element który przed powiększeniem ma margines tak by odległość od pozostałych elementów była taka jak po jego powiększeniu. A gdy na niego najedziesz i się powiększa, to jednocześnie margines maleje, lub całkowicie go nie ma. Musisz przetestować.

U mnie menu jest poziome i ma stałą szerokość, dlatego, że <ul>, też mam :hover i margines znikał po najechaniu nawet obok linku.

BTW. Sposób który przedstawiłem jest trochę na około. Początkowo szukałem rozwiązania, jak zmieniać parametry innego elementu, najeżdżając na całkiem inny. Znalazłem coś takiego:
  1. a:hover div {
  2. tu styl diva po najechaniu na link
  3. }

Ale niestety nie chciało mi zadziałać. Może ktoś mi wyjaśnić w czym błąd?
Darek82
Hej próbowałem tak jak piszesz na logike to powinno działać jednak jak zeruje margines z lewej i prawej to nie ma reakcji wogóle :/

  1. #top ul li a:hover {
  2. font-weight:bold;
  3. margin:0px 0px 0px 0px;
  4. }
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.