Guest User

menu resolution problem

a guest
Jan 23rd, 2015
245
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
CSS 3.03 KB | None | 0 0
  1. @import url(http://fonts.googleapis.com/css?family=Oxygen+Mono);
  2. /* Starter CSS for Menu */
  3. #cssmenu {
  4.   padding: 0;
  5.   margin: 0;
  6.   border: 0;
  7.   width: auto;
  8. }
  9. #cssmenu ul,
  10. #cssmenu li {
  11.   list-style: none;
  12.   margin: 0;
  13.   padding: 0;
  14. }
  15. #cssmenu ul {
  16.   position: relative;
  17.   z-index: 597;
  18. }
  19. #cssmenu ul li {
  20.   float: left;
  21.   min-height: 1px;
  22.   vertical-align: middle;
  23. }
  24. #cssmenu ul li.hover,
  25. #cssmenu ul li:hover {
  26.   position: relative;
  27.   z-index: 599;
  28.   cursor: default;
  29. }
  30. #cssmenu ul ul {
  31.   visibility: hidden;
  32.   position: absolute;
  33.   top: 100%;
  34.   left: 0;
  35.   z-index: 598;
  36.   width: 100%;
  37. }
  38. #cssmenu ul ul li {
  39.   float: none;
  40. }
  41. #cssmenu ul ul ul {
  42.   top: 0;
  43.   left: 190px;
  44.   width: 190px;
  45. }
  46. #cssmenu ul li:hover > ul {
  47.   visibility: visible;
  48. }
  49. #cssmenu ul ul {
  50.   bottom: 0;
  51.   left: 0;
  52. }
  53. #cssmenu ul ul {
  54.   margin-top: 0;
  55. }
  56. #cssmenu ul ul li {
  57.   font-weight: normal;
  58. }
  59. #cssmenu a {
  60.   display: block;
  61.   line-height: 1em;
  62.   text-decoration: none;
  63. }
  64. /* Custom CSS Styles */
  65. #cssmenu {
  66.   background: #333333;
  67.   border-bottom: 4px solid #1b9bff;
  68.   font-family: 'Oxygen Mono', Tahoma, Arial, sans-serif;
  69.   font-size: 10px;
  70. }
  71. #cssmenu > ul {
  72.   *display: inline-block;
  73. }
  74. #cssmenu:after,
  75. #cssmenu ul:after {
  76.   content: '';
  77.   display: block;
  78.   clear: both;
  79. }
  80. #cssmenu ul {
  81.   text-transform: uppercase;
  82. }
  83. #cssmenu ul ul {
  84.   border-top: 4px solid #1b9bff;
  85.   text-transform: none;
  86.   min-width: 190px;
  87. }
  88. #cssmenu ul ul a {
  89.   background: #1b9bff;
  90.   color: #ffffff;
  91.   border: 1px solid #0082e7;
  92.   border-top: 0 none;
  93.   line-height: 150%;
  94.   padding: 16px 20px;
  95.   font-size: 10px;
  96. }
  97. #cssmenu ul ul ul {
  98.   border-top: 0 none;
  99. }
  100. #cssmenu ul ul li {
  101.   position: relative;
  102. }
  103. #cssmenu ul ul li:first-child > a {
  104.   border-top: 1px solid #0082e7;
  105. }
  106. #cssmenu ul ul li:hover > a {
  107.   background: #4eb1ff;
  108.   color: #ffffff;
  109. }
  110. #cssmenu ul ul li:last-child > a {
  111.   -moz-border-radius: 0 0 3px 3px;
  112.   -webkit-border-radius: 0 0 3px 3px;
  113.   border-radius: 0 0 3px 3px;
  114.   -moz-background-clip: padding;
  115.   -webkit-background-clip: padding-box;
  116.   background-clip: padding-box;
  117.   -moz-box-shadow: 0 1px 0 #1b9bff;
  118.   -webkit-box-shadow: 0 1px 0 #1b9bff;
  119.   box-shadow: 0 1px 0 #1b9bff;
  120. }
  121. #cssmenu ul ul li:last-child:hover > a {
  122.   -moz-border-radius: 0 0 0 3px;
  123.   -webkit-border-radius: 0 0 0 3px;
  124.   border-radius: 0 0 0 3px;
  125.   -moz-background-clip: padding;
  126.   -webkit-background-clip: padding-box;
  127.   background-clip: padding-box;
  128. }
  129. #cssmenu ul ul li.has-sub > a:after {
  130.   content: '+';
  131.   position: absolute;
  132.   top: 50%;
  133.   right: 15px;
  134.   margin-top: -8px;
  135. }
  136. #cssmenu ul li:hover > a,
  137. #cssmenu ul li.active > a {
  138.   background: #1b9bff;
  139.   color: #ffffff;
  140. }
  141. #cssmenu ul li.has-sub > a:after {
  142.   content: '+';
  143.   margin-left: 5px;
  144. }
  145. #cssmenu ul li.last ul {
  146.   left: auto;
  147.   right: 0;
  148. }
  149. #cssmenu ul li.last ul ul {
  150.   left: auto;
  151.   right: 99.5%;
  152. }
  153. #cssmenu a {
  154.   background: #333333;
  155.   color: #CBCBCB;
  156.   padding: 0 20px;
  157. }
  158. #cssmenu > ul > li > a {
  159.   line-height: 48px;
  160.   font-size: 10px;
  161. }
Advertisement
Add Comment
Please, Sign In to add comment