logo-dw

Go Back   Dreamweaver Club Forums > Dreamweaver forums > Spry
Register FAQ Members List Search Today's Posts Mark Forums Read

Reply
 
Thread Tools Display Modes
Old 12-08-2009, 10:55 PM   #1
stlcards1
 
Join Date: Dec 2009
Posts: 12
Question spry menu problems

Hi all.
I have been converting my website over to css and I can't get the spry navigation bar to work correctly. You can view it at http://www.auburnillinois.us/testsite
Here are my issues.
1. The menu bar is (and was at one point) supposed to be lower. It should be in about the middle of the image in the div containing the menu bar.

2. When a submenu drops down there is a gap between the menu bar and the submenu. I would like it to be directly below. I have adjusted the top value but it did not work.

3. When a submenu has a child menu the child menu drops over the top of the submenu. I would like it to be to the right

4. The submenus are not wide enough and the menu choices wrap. I would like to make them a standard width so the entire choice is one one line.

I have adjusted everything I know how to and nothing seems to work. Could it be something with the div containing the menu bar? I have deleted the menu bar and inserted a new one with default values and it does the same thing.
Thanks in advance
Chris
stlcards1 is offline   Reply With Quote
Old 12-09-2009, 03:41 AM   #2
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

not sure, but one issue might be your #nav div and the related styles. the only thing in that div is the menubar list and it has its own style sheet.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 12-10-2009, 12:02 AM   #3
stlcards1
 
Join Date: Dec 2009
Posts: 12
Default

Are you able to see the code for the spry nav bar? I can't tell if anything is obviously wrong in the code for the spr nav bar.

Thanks Chris
stlcards1 is offline   Reply With Quote
Old 12-10-2009, 12:44 AM   #4
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

As I implied, I'd start by getting rid of the #nav div. Some related styles (#nav ul for instance) may conflict with your Spry menubar styles.

In your CSS the only odd thing I see immediately is this style rule:

ul.MenuBarHorizontal ul
{
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
top: 1;
width: 8.2em;
position: absolute;
left: -1000em;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 95%;
}

I'd try replacing it with:

ul.MenuBarHorizontal ul
{
margin: 0;
padding: 0;
list-style-type: none;
font-size: 100%;
z-index: 1020;
cursor: default;
width: 8.2em;
position: absolute;
left: -1000em;
}

which is the default when you insert a horizontal menubar.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 12-11-2009, 02:28 AM   #5
stlcards1
 
Join Date: Dec 2009
Posts: 12
Default

I have been making progress. I deleted the spry navigation bar and the corresponding css and started over. I did remove the #nav div as you suggested and created one to hold the navigation bar.

The main issue I have is I have a background image in the div containing the nav bar. I would like to make the menu bar transparent so that the background image shows through...this way the only thing that changes on hover is the letters. Is there a way to do this?
Thanks
Chris
stlcards1 is offline   Reply With Quote
Old 12-11-2009, 04:17 AM   #6
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

Remove the background color property from the ul.MenuBarHorizontal a style rule (you'll need to add a ul.MenuBarHorizontal ul a with a background color for the submenus). You'll also need to adjust the hover style rules.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 12-11-2009, 03:39 PM   #7
stlcards1
 
Join Date: Dec 2009
Posts: 12
Default

Thanks for the help. I have got all colors adjusted except for when a submenu has no child submenu. If I change the hover background color for these it also changes the background on the main menu bar...which I don't want.

Which style can I change to accomplish this.
Thanks
Chris
stlcards1 is offline   Reply With Quote
Old 12-11-2009, 04:12 PM   #8
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

Anything you put in a style:

ul.MenuBarHorizontal ul a or ul.MenuBarHorizontal ul a:hover, etc. should only affect submenus, you just need to have that second ul in there so it only applies to lists within the main list (which is what submenus are).

Does that help?

BTW, the style rules that contain MenuBarItemSubmenu only apply to menu items with submenus.
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 12-11-2009, 04:16 PM   #9
DWcourse
DWcourse's Avatar
 
Join Date: Apr 2009
Posts: 3,276
Default

BTW, I'm about 70 miles south of Auburn in Collinsville.

Go Cards! (I hope they can sign Holliday but I wouldn't bet on it).
__________________
If my answer helped, check out DWcourse.com for Dreamweaver tips and tutorials.
DWcourse is offline   Reply With Quote
Old 12-11-2009, 07:16 PM   #10
stlcards1
 
Join Date: Dec 2009
Posts: 12
Default

I go through Collinsville quite a bit. I went to the Rams game a few weeks ago....what a sad team.

Anyway...I must be stupid. I have adjusted submenu style with no luck (I can get it to work on the submenus but the main nav changes color on hover also). Do I need to actually add a style to the sprymenubarhorizontal.css for these to work or am I just not understanding? The last spry menu bar I did for another site I used images on the main menu bar so things were less complicated.

Under my test site if you hover over each item under the government tab and you will see my issue.
Thanks
Chris
stlcards1 is offline   Reply With Quote
Reply


Thread Tools
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT. The time now is 06:37 PM.


Powered by vBulletin® Version 3.8.7
Copyright ©2000 - 2017, vBulletin Solutions, Inc.
Copyright 2006 DreamweaverClub.com