Configuring Smooth Navigational Menu

**renset** · 06-10-2009, 05:30 PM

1) Script Title: Smooth Navigational Menu (v1.02)

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...smoothmenu.htm

3) Describe problem:

I am trying to center the Menu items inside of the menu bar but am not able to do so. I read a previous thread and tried to implement the appropriate coding but it is still not working. The coding that I have used follows.

Thank you for any help you can provide.

Code:

<link rel="stylesheet" type="text/css" href="bbstyles/ddsmoothmenu.css"/>

<!--[if lte IE 7]>
<style type="text/css">
html .ddsmoothmenu{height: 1%;} /*Holly Hack for IE7 and below*/
</style>
<![endif]-->

<script type="text/javascript" src="javascript/jquery.min.js"></script>
<script type="text/javascript" src="javascript/ddsmoothmenu.js">

/***********************************************
* Smooth Navigational Menu- (c) Dynamic Drive DHTML code library (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/

</script>
<style type="text/css">
<!--
.style1 {font-size: 9pt}
-->
</style>

</head>

<body background="images/bg3.png">

<div id="container">
<div class="banner"><img src="images/banner.png" /></div>

<table bgcolor="#663300" width="100%"> 
<tr bgcolor="#663300">
<td colspan="2" bgcolor="#663300" >
<div id="smoothmenu1" class="ddsmoothmenu">
<ul>
<li><a href="bakery3.html">Home</a></li>
<li><a href="menu.html">Menu</a></li>
<li><a href="occasions.html">Special Occasions</a></li>		
<li><a href="store.html">Our Store</a></li>
<li><a href="about.html">About</a></li>
<li><a href="conactbb.html" style="border:none">Contact</a></li>

</ul>
</div>

</td>
</tr>
</table>

CSS Coding:

.ddsmoothmenu{
font: bold 12px Verdana;
background: #663300; /*background of menu bar (default state)*/
width: 100%;
float:center;
}

.ddsmoothmenu ul{
z-index:100;
margin: 0 auto;
padding: 0;
list-style-type: none;
width: 750px; 
}

/*Top level list items*/
.ddsmoothmenu ul li{
position: relative;
display: inline;
float: left;
}

/*Top level menu link items style*/
.ddsmoothmenu ul li a{
display: block;
background: #663300; /*background of menu items (default state)*/
color: white;
padding: 6px 43px;
border-right: 1px solid #B67721;
color: #B67721;
text-decoration: none;
}

* html .ddsmoothmenu ul li a{ /*IE6 hack to get sub menu links to behave correctly*/
display: inline-block;
}

.ddsmoothmenu ul li a:link, .ddsmoothmenu ul li a:visited{/*sets text color of all items*/
color: #FBF9B5;
}

.ddsmoothmenu ul li a.selected{ /*CSS class that's dynamically added to the currently active menu items' LI A element*/
background: #A04D00; /*sets color of main nav items*/
color: #FBF9B5; /*sets color of main text nav items*/
}

.ddsmoothmenu ul li a:hover{
background: #B67721; /*background of sub menu items during onmouseover (hover state)*/
color: #FBF9B5;
}

Thread: Configuring Smooth Navigational Menu

Thread Tools

Search Thread

Configuring Smooth Navigational Menu

Bookmarks

Bookmarks

Posting Permissions