Integrating Glossy Horizontal Menu
-
I am trying to incorporate a Glossy Horizontal Menu found here (https://www.dynamicdrive.com/style/csslibrary/item/glossy_horizontal_menu/) into a WordPress site I’m building using the free version of the Mimbo theme.
Here is the code from the glossy menu:
<style type="text/css"> /*Credits: By Santosh Setty (https://webdesigninfo.wordpress.com) */ /*Posted to: Dynamic Drive CSS Library (https://www.dynamicdrive.com/style/) */ .glossymenu{ position: relative; padding: 0 0 0 34px; margin: 0 auto 0 auto; background: url(media/menur_bg.gif) repeat-x; /*tab background image path*/ height: 46px; list-style: none; } .glossymenu li{ float:left; } .glossymenu li a{ float: left; display: block; color:#000; text-decoration: none; font-family: sans-serif; font-size: 13px; font-weight: bold; padding:0 0 0 16px; /*Padding to accomodate left tab image. Do not change*/ height: 46px; line-height: 46px; text-align: center; cursor: pointer; } .glossymenu li a b{ float: left; display: block; padding: 0 24px 0 8px; /*Padding of menu items*/ } .glossymenu li.current a, .glossymenu li a:hover{ color: #fff; background: url(media/menur_hover_left.gif) no-repeat; /*left tab image path*/ background-position: left; } .glossymenu li.current a b, .glossymenu li a:hover b{ color: #fff; background: url(media/menur_hover_right.gif) no-repeat right top; /*right tab image path*/ } </style>
And here is the navigation code from Mimbo:
#nav { background:#777; font-size:1.1em; } #nav, #nav ul { list-style: none; line-height: 1; } #nav a, #nav a:hover { display: block; text-decoration: none; border:none; } #nav li { float: left; list-style:none; border-right:1px solid #a9a9a9; } #nav a, #nav a:visited { display:block; font-weight:bold; color: #f5f5f4; padding:6px 12px; } #nav a:hover, #nav a:active, .current_page_item a, #home .on { background:#000; text-decoration:none }
Iève worked for the last 24 hours trying to get this to work together without having to resort to doing it where I have to manually add the navigation links. Does anyone have any suggestionsé I would greatly appreciate it.
Thanks
- The topic ‘Integrating Glossy Horizontal Menu’ is closed to new replies.