menubarLinks.css 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. ul[role="menubar"] {
  2. margin: 10px;
  3. padding: 10px;
  4. font-size: 110%;
  5. list-style: none;
  6. background-color: #eee;
  7. }
  8. ul[role="menubar"] [role="menuitem"],
  9. ul[role="menubar"] [role="separator"] {
  10. padding: 0.25em;
  11. background-color: #eee;
  12. border: 2px solid #eee;
  13. }
  14. ul[role="menubar"] [role="separator"] {
  15. padding-top: 0.15em;
  16. background-image: url('#path_pre#/scripts/menubar_images/separator.png');
  17. background-position: center;
  18. background-repeat: repeat-x;
  19. }
  20. ul[role="menubar"] [role="menuitem"]:focus,
  21. ul[role="menubar"] [role="menuitem"]:hover,
  22. ul[role="menubar"] [role="separator"]:focus,
  23. ul[role="menubar"] [role="separator"]:hover {
  24. background-color: black;
  25. color: white;
  26. }
  27. ul[role="menubar"] a[role="menuitem"] {
  28. text-decoration: none;
  29. color: black;
  30. }
  31. ul[role="menubar"] li {
  32. list-style: none;
  33. margin: 0;
  34. padding: 0;
  35. }
  36. ul[role="menubar"] > li {
  37. display: inline;
  38. position: relative;
  39. }
  40. ul[role="menubar"] > li > a::after {
  41. content: url('#path_pre#/scripts/menubar_images/down-arrow-brown.png');
  42. padding-left: 0.25em;
  43. }
  44. ul[role="menubar"] ul[role="menu"] {
  45. display: none;
  46. position: absolute;
  47. top: -2px;
  48. left: 0;
  49. margin: 0;
  50. padding: 0;
  51. }
  52. ul[role="menubar"] ul[role="menu"] li a {
  53. display: block;
  54. width: 10em;
  55. }
  56. ul[role="menubar"] ul[role="menu"] a[aria-haspopup="true"]::after {
  57. content: url('#path_pre#/scripts/menubar_images/right-arrow-brown.png');
  58. padding-right: 2em;
  59. }