Czy spotkaliście się z czymść takim w Chrome i tylko w Chrome, że po najechaniu kursorem myszki na ul li pokazywało się ul li ul ale po najechaniu kursorem na ul li ul menu ul li ul znikało. Jednak gdy wejdę na inną zakładkę i wrócę na moją stronę to menu cudownie zaczyna działać. CSS jest następujący:

[HTML] pobierz, plaintext 
  1. nav { float:left; margin-top:0px; margin-left:-20px; }
  2. nav a {color: #4d4d4d;}
  3. nav ul, nav ul ul { margin:0 0 0 20px; padding:0; list-style-type:none; list-style-position:outside; background:#ffffff; position:relative; z-index:5000; font:12px Open Sans; }
  4. nav ul a:link, nav ul a:active, nav ul a:visited { display:block; padding:0; text-decoration:none; }
  5. nav ul ul a:link, nav ul ul a:active, nav ul ul a:visited { display:block; padding:0 0 0 3px; text-decoration:none; }
  6. nav ul li { float:left; position:relative; background:none; padding:5px 12px; margin-right:6px; text-shadow:#ffffff 1px 1px 0px; transition: all 300ms ease-in; }
  7. nav ul li:hover { background:#ededed; }
  8. nav ul ul { position:absolute; left:-20px; text-align:left; padding:8px 0 14px 10px; border-top:3px solid #f69200; box-shadow: 5px 5px 4px 0px rgba(00, 00, 00, 0.2); width:180px; top:26px; display:none; font-size:12px; font-family:Open Sans; }
  9. nav ul ul a { color:#414141; }
  10. nav ul li ul a { width:170px; float:left; }
  11. nav ul ul ul:hover{ width:180px; }
  12. nav ul li ul ul { left:160px; top:-2px; margin:0px; border-left:3px solid #f69200; border-top:none; }
  13. nav ul li ul li { padding:10px 0px 10px 5px; margin-left:0px; margin-right:0px; height:14px; width:166px; border-bottom:1px solid #ededed; max-width:none; list-style-type:none; text-transform:none; }
  14. nav ul li:hover ul ul, nav ul li:hover ul ul ul, nav ul li:hover ul ul ul ul { display:none; }
  15. nav ul li:hover ul, nav ul li li:hover ul, nav ul li li li:hover ul, nav ul li li li li:hover ul { display:block; }
  16. nav ul li ul.children li { list-style-type:none; }
  17. nav ul li.current-menu-item { background:#f69200; color:#ffffff; text-shadow:none; }
  18. nav ul li ul li.current-menu-item { background:#ededed; color:#8a8a8a; text-shadow:none; }
  19. nav ul li ul li.current-menu-item a { color:#8a8a8a; }
  20. nav ul li.current-menu-item a { color:#ffffff; }
  21. nav ul li.current-menu-item ul li a { color:#414141; }
  22. nav ul li.current-menu-item span { color:#ffffff; }
  23. nav ul li.parent { background-image: url( images/menu-arrow3.png ); background-position: right center; background-repeat: no-repeat; }
  24. nav ul li ul li.parent { background-image: url( images/menu-arrow3-child.png ); background-position: 160px center; background-repeat: no-repeat; }
  25. nav ul li.current-menu-item { background-image:none; }
  26. nav ul li.parent:hover { background-image: url( images/menu-arrow1.png ); background-position: center bottom; background-repeat: no-repeat; }
  27. nav ul li.parent.current-menu-item:hover { }
  28. nav ul li ul li.parent:hover { background-image: url( images/menu-arrow2.png ); background-position: 152px center; background-repeat: no-repeat; }
[HTML] pobierz, plaintext





Tutaj jest cały kod:

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html lang="en-US"><head>
  3.  
  4. <style type="text/css">
  5. body { color:#505050; font-size: 12px; padding:0px; }
  6.  
  7. nav ul, nav ul ul { margin:0 0 0 20px; padding:0; list-style-type:none; list-style-position:outside; background:#ffffff; position:relative; z-index:500; }
  8. nav ul a:link, nav ul a:active, nav ul a:visited { display:block; padding:0; text-decoration:none; }
  9. nav ul ul a:link, nav ul ul a:active, nav ul ul a:visited { display:block; padding:0 0 0 3px; text-decoration:none; }
  10. nav ul li { float:left; position:relative; padding:5px 12px; margin-right:6px; }
  11. nav ul ul { position:absolute; left:-20px; text-align:left; padding:8px 0 14px 10px; width:180px; top:25px; display:none; font-size:12px; }
  12. nav ul li ul a { width:170px; float:left; }
  13. nav ul ul ul:hover{ width:180px; }
  14. nav ul li ul ul { left:160px; top:-2px; margin:0px; border-left:3px solid #f69200; border-top:none; }
  15. nav ul li ul li { padding:10px 0px 10px 5px; margin-left:0px; margin-right:0px; height:14px; width:166px; border-bottom:1px solid #ededed; max-width:none; list-style-type:none; text-transform:none; }
  16. nav ul li:hover ul ul, nav ul li:hover ul ul ul, nav ul li:hover ul ul ul ul { display:none; }
  17. nav ul li:hover ul, nav ul li li:hover ul, nav ul li li li:hover ul, nav ul li li li li:hover ul { display:block; }
  18. nav ul li ul.children li { list-style-type:none; }
  19. </style>
  20.  
  21.  
  22. 	<body>
  23.  
  24. 	<nav>
  25.  
  26. 			<ul id="menu-main" class="nav"><li id="menu-item-154" class="parent menu-item menu-item-has-children menu-item-154"><a href="">Home</a>
  27. <ul class="sub-menu">
  28. 	<li id="menu-item-283" class="menu-item menu-item-283"><a href="frontpage-2/">Frontpage 2</a></li>
  29. 	<li id="menu-item-282" class="menu-item menu-item-282"><a href="frontpage-3/">Frontpage 3</a></li>
  30. 	<li id="menu-item-476" class="menu-item menu-item-476"><a href="frontpage-4/">Frontpage 4</a></li>
  31. </ul>
  32. </li>
  33. <li id="menu-item-78" class="parent menu-item current-menu-ancestor current-menu-parent current_page_parent current_page_ancestor menu-item-has-children menu-item-78"><a href="about-us/">About Us</a>
  34. <ul class="sub-menu">
  35. 	<li id="menu-item-260" class="menu-item current-menu-item page_item page-item-258 current_page_item menu-item-260"><a href="shortcodes/">Shortcodes</a></li>
  36. 	<li id="menu-item-116" class="menu-item menu-item-116"><a href="child-menu-1/">Fusce feugiat a interdum</a></li>
  37. 	<li id="menu-item-115" class="parent menu-item menu-item-has-children menu-item-115"><a href="child-menu-2/">Full width page</a>
  38. 	<ul class="sub-menu">
  39. 		<li id="menu-item-128" class="menu-item menu-item-128"><a href="child-menu-a/">Aliquam erat volutpat</a></li>
  40. 		<li id="menu-item-127" class="menu-item menu-item-127"><a href="child-menu-b/">Non pellentesque</a></li>
  41. 	</ul>
  42. </li>
  43. 	<li id="menu-item-114" class="menu-item menu-item-114"><a href="child-menu-3/">Nam quis sollicitudin</a></li>
  44. 	<li id="menu-item-126" class="menu-item menu-item-126"><a href="child-menu-4/">Etiam nulla vitae</a></li>
  45. 	<li id="menu-item-427" class="parent menu-item menu-item-has-children menu-item-427"><a href="events/">Events</a>
  46. 	<ul class="sub-menu">
  47. 		<li id="menu-item-428" class="menu-item menu-item-428"><a href="events/my-bookings/">My Bookings</a></li>
  48. 		<li id="menu-item-429" class="menu-item menu-item-429"><a href="events/tags/">Tags</a></li>
  49. 		<li id="menu-item-430" class="menu-item menu-item-430"><a href="events/categories/">Categories</a></li>
  50. 		<li id="menu-item-431" class="menu-item menu-item-431"><a href="events/locations/">Locations</a></li>
  51. 	</ul>
  52. </li>
  53. 	<li id="menu-item-125" class="menu-item menu-item-125"><a href="child-menu-5/">Morbi varius augue</a></li>
  54. </ul>
  55. </li>
  56. <li id="menu-item-22" class="parent menu-item menu-item-has-children menu-item-22"><a href="activity/">Activity</a>
  57. <ul class="sub-menu">
  58. 	<li id="menu-item-159" class="menu-item menu-item-159"><a href="suspendisse-et-nunc/">Suspendisse et nunc</a></li>
  59. </ul>
  60. </li>
  61. <li id="menu-item-28" class="menu-item menu-item-28"><a href="blog/">Blog</a></li>
  62. <li id="menu-item-20" class="menu-item menu-item-20"><a href="forum/">Forum</a></li>
  63. <li id="menu-item-21" class="menu-item menu-item-21"><a href="groups/">Groups</a></li>
  64. <li id="menu-item-23" class="menu-item menu-item-23"><a href="members/">Members</a></li>
  65. <li id="menu-item-79" class="parent menu-item menu-item-79"><a href="contact-us/">Contact Us</a>
  66. <ul class="sub-menu">
  67. 	<li id="menu-item-243" class="parent menu-item menu-item-243"><a href="">My Account (Shop)</a></li>
  68. 	<li id="menu-item-247" class="menu-item menu-item-247"><a href="">Track your order</a></li>
  69. 	<li id="menu-item-248" class="parent menu-item menu-item-248"><a href="checkout/">Checkout</a></li>
  70. 	<li id="menu-item-251" class="menu-item menu-item-251"><a href="cart/">Cart</a></li>
  71. 	<li id="menu-item-252" class="parent menu-item menu-item-has-children menu-item-252"><a href="shop/">Shop</a>
  72. 	<ul class="sub-menu">
  73. 		<li id="menu-item-253" class="menu-item menu-item-type-taxonomy menu-item-object-product_cat menu-item-253"><a href="product-category/jeans/">Jeans</a></li>
  74. 		<li id="menu-item-254" class="menu-item menu-item-type-taxonomy menu-item-object-product_tag menu-item-254"><a href="product-tag/product-tag-1/">Product tag 1</a></li>
  75. 	</ul>
  76. </li>
  77. </ul>
  78. </li>
  79. </ul>
  80. </nav>
  81.  
  82.  
  83. </body></html>
[HTML] pobierz, plaintext