Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [CSS][HTML] Obniżenie kolejnych elementów, Zmiana po update chrome
boro11
post
Post #1





Grupa: Zarejestrowani
Postów: 283
Pomógł: 11
Dołączył: 9.07.2010
Skąd: Warszawa

Ostrzeżenie: (0%)
-----


Witam!
Jakiś czas temu zrobiłem sobie menu wszystko było w porządku na każdej przeglądarce do dziś. Podejrzewam, że była jakaś aktualizacja tej przeglądarki i teraz wyświetla się nie poprawnie.

Mój CSS:

  1. #menu {
  2. margin-left: 360px;
  3. }
  4.  
  5. #menu ul {
  6. position: absolute;
  7. float: left;
  8. list-style-type:none;
  9. }
  10.  
  11. #menu li {
  12. display: inline;
  13. }
  14.  
  15. #menu a {
  16. background: url(../images/button_background.png);
  17. width: 128px;
  18. height: 85px;
  19. display: inline-block;
  20. text-align: center;
  21. float: left;
  22. color: #fff;
  23. font: 16px "Noto Sans";
  24. text-decoration: none;
  25. padding-top: 48px;
  26. margin-right: -20px;
  27. }
  28.  
  29.  
  30. #menu li:nth-child(1) a {
  31. background: url(../images/home_icon.png) 51px 22px no-repeat, url(../images/button_background.png) right bottom no-repeat;
  32. padding-right: 10px;
  33. }
  34.  
  35. #menu li:nth-child(1) a:hover {
  36. background: url(../images/home_icon.png) 51px 22px no-repeat, url(../images/button_background_hover.png) no-repeat;
  37. }
  38.  
  39. #menu li:nth-child(2) a {
  40. background: url(../images/sites_icon.png) 51px 22px no-repeat, url(../images/button_background.png)no-repeat;
  41. padding-right: 10px;
  42. }
  43.  
  44. #menu li:nth-child(2) a:hover {
  45. background: url(../images/sites_icon.png) 51px 22px no-repeat, url(../images/button_background_hover.png)no-repeat;
  46. }
  47.  
  48. #menu li:nth-child(3) a {
  49. background: url(../images/register_icon.png) 56px 22px no-repeat, url(../images/button_background.png)no-repeat;
  50. padding-right: 10px;
  51. }
  52.  
  53. #menu li:nth-child(3) a:hover {
  54. background: url(../images/register_icon.png) 56px 22px no-repeat, url(../images/button_background_hover.png)no-repeat;
  55. }
  56.  
  57. #menu li:nth-child(4) a {
  58. background: url(../images/login_icon.png) 55px 22px no-repeat, url(../images/button_background.png)no-repeat;
  59. padding-right: 10px;
  60. }
  61.  
  62. #menu li:nth-child(4) a:hover {
  63. background: url(../images/login_icon.png) 55px 22px no-repeat, url(../images/button_background_hover.png)no-repeat;
  64. }
  65.  
  66. #menu li:nth-child(5) a {
  67. background: url(../images/helpdesk_icon.png) 55px 22px no-repeat, url(../images/button_background.png)no-repeat;
  68. padding-right: 10px;
  69. }
  70.  
  71. #menu li:nth-child(5) a:hover {
  72. background: url(../images/helpdesk_icon.png) 55px 22px no-repeat, url(../images/button_background_hover.png)no-repeat;
  73. }
  74.  
  75. #menu li:nth-child(6) a {
  76. background: url(../images/forum_icon.png) 51px 22px no-repeat, url(../images/button_background.png)no-repeat;
  77. padding-right: 10px;
  78. }
  79.  
  80. #menu li:nth-child(6) a:hover {
  81. background: url(../images/forum_icon.png) 51px 22px no-repeat, url(../images/button_background_hover.png)no-repeat;
  82. }


HTML:

  1. <div id="account_menu">
  2.  
  3. <ul>
  4. <li>
  5. <a href="#"><i></i>General</a>
  6. <ul class="closed">
  7. <li><a href="<?=$url?>account/" title='Account'>Account</a></li>
  8. <li><a href="<?=$url?>banner/" title='Banners'>Referrals Tools</a></li>
  9. <li><a href="<?=$url?>request/" title='Cashout'>Cashout</a></li>
  10. <li><a href="<?=$url?>upload/" title='Upload'>Upload Proof</a></li>
  11. </ul>
  12. </li>
  13.  
  14. <li>
  15. <a href="#"><i></i>Message</a>
  16. <ul class="closed">
  17. <li><a href="<?=$url?>pmw/" title='New Message'>New Message</a></li>
  18. <li><a href="<?=$url?>pm/" title='Inbox'>Inbox (<?=$rows['ile']?>) new</a></li>
  19. <li><a href="<?=$url?>pmo/" title='Outbox'>Outbox</a></li>
  20. </ul>
  21. </li>
  22.  
  23. <li>
  24. <a href="#"><i></i>Other</a>
  25. <ul class="closed">
  26. <li><a href="<?=$url?>upgrade/" title='Upgrade Packs'>Upgrade!</a></li>
  27. <li><a href="<?=$url?>checker/" title='Sites Checker'>Sites Checker</a></li>
  28. </ul>
  29. </li>
  30.  
  31. <li>
  32. <a href="#"><i></i>Referrals</a>
  33. <ul class="closed">
  34. <li><a href="<?=$url?>referrals/" title='Direct'>Direct</a></li>
  35. </ul>
  36. </li>
  37.  
  38. <li>
  39. <a href="#"><i></i>Settings</a>
  40. <ul class="closed">
  41. <li><a href="<?=$url?>personal/" title='Personal'>Personal Settings</a></li>
  42. </ul>
  43. </li>
  44.  
  45. <li>
  46. <a href="#"><i></i>History</a>
  47. <ul class="closed">
  48. <li><a href="<?=$url?>history/" title='Payment'>Payment</li>
  49. <li><a href="<?=$url?>earnings/" title='Earnings'>Earnings</a></li>
  50. </ul>
  51. </li>
  52. </ul>
  53.  
  54. </div>


Problemem jest to, że od drugiego elemntu cała reszta jest lekko w dół:

(IMG:http://clip2net.com/clip/m106573/thumb640/1389891662-clip-20kb.jpg)

Powinno być tak:

(IMG:http://clip2net.com/clip/m106573/thumb640/1389891683-clip-20kb.jpg)

Kombinowałem trochę w CSS, ale nie mam pojęcia co mogło to spowodować.
Go to the top of the page
+Quote Post

Posty w temacie


Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 



RSS Aktualny czas: 24.08.2025 - 21:03