Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [CSS][HTML]Wyśrodkowanie diva
Forum PHP.pl > Forum > Przedszkole
cv65
Witam
Mój problem polega na tym że nie moge wysrodkować diva ponieważ przeszkadza mi float: left;

Mój kod:

  1. .navigation ul {margin:0 auto; }
  2. .navigation {
  3. padding:0 0 0 20px;
  4. list-style:none;
  5. text-align:center;
  6. height:40px;
  7. background:#1841c8 url({WWW}images/nav_background.gif);
  8. }
  9. .navigation li {
  10. float:left;
  11. text-align:center;
  12. }
  13. .navigation li a {
  14. text-align:center;
  15. display:block;
  16. float:left;
  17. height:40px;
  18. line-height:40px;
  19. color:#FFFFFF;
  20. text-decoration:none;
  21. font-family:arial, verdana, sans-serif;
  22. text-align:center;
  23. padding:0 0 0 10px;
  24. cursor:pointer;
  25. font-size:11px;
  26. }
  27. .navigation li a b {
  28. float:left;
  29. text-align:center;
  30. display:block;
  31. padding:0 16px 0 8px;
  32. }
  33. .navigation li.current a {
  34. color:#FFFFFF;
  35. background:url({WWW}images/nav_hover.gif);
  36. }
  37. .navigation li a:hover {
  38. color:#00CCFF;
  39. background: url({WWW}images/nav_hover.gif);
  40. }
  41. .navigation li a {
  42. display:block;
  43. float:left;
  44. width:30px;
  45. height:40px;
  46. }


  1. <ul class="navigation">
  2. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  3. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  4. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  5. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  6. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  7. <li><a href="http://www.hv-designs.co.uk"><b>Home</b></a></li>
  8. </ul>

Proszę o pomoc bo sam nie dam rady sadsmiley02.gif

Pozdrawiam smile.gif
patryczakowy
a gdzie ten div?
DirectPL
Wyrzuć to:
  1. .navigation ul {margin:0 auto; }


Samo ".navigation" odnosi się do "ul".

Dodaj do "navigation": "margin: 0 auto;"

Czyli klasa .navigation przedstawia się następująco:
  1. .navigation {
  2. padding:0 0 0 20px;
  3. list-style:none;
  4. text-align:center;
  5. height:40px;
  6. background:#1841c8 url({WWW}images/nav_background.gif);
  7. margin: 0 auto;
  8. }


Ewentualnie jak nie będzie działać, to wrzuć to menu do diva o klasie: "nav"

  1. .nav {
  2. margin: 0 auto;
  3. width: 100%;
  4. height: 40px;
  5. }
pedro84
Zastanawia mnie tylko sens ładowania nawigacji w takiego diva. Po co tak?
cv65
niestety to niedziała ani drgnie
krzysztof_kf
Cytat(cv65 @ 4.05.2010, 09:55:57 ) *
niestety to niedziała ani drgnie



co chcsz wyśrodkować całą zawartość tzw menu z tłem ? czy co jeśli same menu żeby wyśrodkować musisz dać

to na przykład i usuń float: left;

  1.  
  2. .navigation li {
  3. width: 1000px;
  4. margin: 0 auto;
cv65
napisałem trochę inaczej kod menu i teraz śmiga dzięki za pomoc smile.gif
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.