Nav Drop down (Horizontal to verticle)

Tagged: horizonal, legacy, nav

This topic has 5 replies, 2 voices, and was last updated 12 years ago by Wes.

Viewing 6 posts - 1 through 6 (of 6 total)

Author

Posts
April 29, 2013 at 2:56 pm #4411
gregorypessa
Customer
Hello again Wes,
I had a developer design a site under the basis of the legacy theme. I want to change the drop down from a horizontal hover to a vertical hover. Like the original legacy theme. Could you point me to what I should be looking for in CSS?

His nav code.

#nav #menu-primary-menu li.current-menu-item a { background-color: #07455c; }
#nav #menu-primary-menu li.current_page_parent a { background-color: #07455c; }
#nav #menu-primary-menu li a { text-decoration: none; color: #fff; padding: 7px 25px; cursor: pointer; }
#nav #menu-primary-menu li:Hover { z-index: 1; }
#nav #menu-primary-menu li a:Hover { background-color: #07455c; }
#nav #menu-primary-menu li.sfHover a { background-color: #07455c; }
#nav #menu-primary-menu li ul { position: absolute; top: 27px; left: 0; background-color: #016e85; width: 300px; padding: 0; }
#nav #menu-primary-menu li li li { text-align: center; display: inline-block; float: left; margin: 1px 0 0 0; }
#nav #menu-primary-menu li ul li a { padding: 7px; display: inline-block; background-color: #016e85; }
#nav #menu-primary-menu li.sfHover ul li a { padding: 7px; display: inline-block; background-color: #016e85; }
#nav #menu-primary-menu li ul li a:Hover { background-color: #07455c; cursor: pointer; }

Greg
April 29, 2013 at 8:53 pm #4422
Wes
Moderator
It should be a vertical dropdown already…..unless you’re talking about the Mobile Responsive code? If so, then take a look around line 3275 in your css for something like this –
```
.menu li {
	float: none;
	display: inline-block;
}
```
You could change it to this –
```
.menu li {
	clear: both;
	float: left;
	display: inline-block;
}
```
….and it will look like this – http://i.imgur.com/x97U0y3.png

If you’re talking about something totally different, just let me know.
May 3, 2013 at 2:35 pm #4531
gregorypessa
Customer
It is completely different… Due to the developers. The currently have it set to horizontal, which you can see at our site http://metcalfinstitute.org/.
May 5, 2013 at 3:35 pm #4558
Wes
Moderator
It would probably be easier to just revert the entire menu section/code back to the original code and work your way back up. There are so many things changed and added to the code which is what is causing the issue.
May 6, 2013 at 4:09 pm #4577
gregorypessa
Customer
Wes,
Thanks for the help per usual. Is there a specific code I should be looking for? It doesn’t appear to be in the css.
May 6, 2013 at 9:03 pm #4581
Wes
Moderator
Yes I’m actually referring to your css. Anything dealing with the Nav/Primary Nav/Menu etc…. I would suggest you revert the css that was changed back to the original and then work your way back up.
Author

Posts

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.