Advertisement
Guest User

Untitled

a guest
Mar 5th, 2015
220
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.09 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5.  
  6.  
  7.  
  8. <style type="text/css">
  9.  
  10.  
  11. #navMenu, #navMenu ul, #navMenu ul li, #navMenu ul li ul, #navMenu ul li ul li, .clearFloat {
  12. margin: 0;
  13. padding: 0;
  14. }
  15.  
  16. #navMenu ul {
  17. line-height: 30px;
  18.  
  19. }
  20.  
  21. #navMenu ul li {
  22. list-style: none;
  23. float: left;
  24. width: auto;
  25. background: #c7c7c7;
  26.  
  27.  
  28.  
  29. }
  30.  
  31.  
  32. #navMenu ul li ul {
  33. /* display: none; */
  34. clear: both;
  35. position: absolute;
  36. top: 50px;
  37. position: absolute;
  38. visibility: hidden;
  39. }
  40.  
  41.  
  42. #navMenu ul li ul li {
  43. list-style-type: none;
  44. float: left;
  45. width: auto;
  46. }
  47.  
  48.  
  49.  
  50. #navMenu ul li a {
  51. text-align: left;
  52. padding: 5px 15px;
  53. font-family: "Helvetica";
  54. text-decoration: none;
  55. height: 30px;
  56. display: block;
  57. color: black;
  58. border: 1px solid #a0a0a0;
  59.  
  60.  
  61. }
  62.  
  63.  
  64.  
  65. #navMenu ul li:hover ul {
  66. visibility: visible;
  67. }
  68.  
  69.  
  70.  
  71. #navMenu li:hover {
  72. background: #b9897d;
  73.  
  74. }
  75.  
  76. #navMenu ul li: hover ul li a:hover {
  77. background: #b9897d;
  78. color: black;
  79.  
  80. }
  81.  
  82.  
  83. #navMenu a:hover {
  84. color: black;
  85.  
  86. }
  87.  
  88.  
  89. .clearFloat {
  90. clear: both;
  91.  
  92. }
  93.  
  94.  
  95.  
  96.  
  97. </style>
  98. </head>
  99.  
  100.  
  101.  
  102. <body>
  103.  
  104.  
  105. <div id="nav1">
  106.  
  107. <div id="navMenu">
  108.  
  109. <ul>
  110. <li>
  111. <a href="#">Über uns</a>
  112. <ul>
  113. <li> <a href="#">Culturverein e.V. </a> </li>
  114. <li> <a href="#">Mitgliedschaft &amp; Spende</a></li>
  115. <li> <a href="#">Medien &amp; Presse </a></li>
  116. <li> <a href="#">Newsletter</a></li>
  117. </ul>
  118. </li>
  119. </ul>
  120.  
  121. <ul>
  122. <li>
  123. <a href="#">Kino Studio 17</a>
  124. <ul>
  125. <li> <a href="#">Das Kino</a> </li>
  126. <li> <a href="#">Programm</a></li>
  127. <li> <a href="#">Reservieren </a></li>
  128. </ul>
  129. </li>
  130. </ul>
  131.  
  132. <ul>
  133. <li>
  134. <a href="#">Theater Atrium</a>
  135. <ul>
  136. <li> <a href="#">Das Theater</a> </li>
  137. <li> <a href="#">Programm</a></li>
  138. <li> <a href="#">Reservieren</a></li>
  139. </ul>
  140.  
  141.  
  142. </li>
  143. </ul>
  144. <ul>
  145. <li>
  146. <a href="#">Kontakte</a>
  147.  
  148. </li>
  149. </ul>
  150.  
  151.  
  152. <br class="clearFloat" />
  153.  
  154. </div>
  155.  
  156.  
  157.  
  158. </div>
  159.  
  160.  
  161.  
  162. </body>
  163. </html>
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement