Drop Down Navigation

[princealbert 0]

Hello, Here the URL of the development site web I working on : http://artifact.camille.pro/ Instead of vertical drop-down menu I would like to have a look like this : I have been looking round and round without finding any solution : I'm not a pro of coding !! It is really hot for me to find a solution Thanks Camille

[bryan-hadaway 3]

`body .sub-menu li a:hover{display:inline}` Add to Custom Code > Custom CSS. Let me know what effect if any it has. Thanks, Bryan

[princealbert 0]

Hi Bryan, sorry but your solution does not work, you can see the effect online ... I still do not find the right solution to my problem. looking forward to hear you Thanks, Camille N.B. Sorry for the response delay, we're in south of France so we have to handle the jet lag !

[catrina 103]

Can you post the link to the website where that screenshot came from?

[princealbert 0]

Hi Catrina, there is no link for that screen shot : it has been design with photoshop and this is the final look of the web site must have. Thanks, Camille

[catrina 103]

Ohhh, I see. If you want to accomplish the look of the menu, in the screenshot, you will need those individual navigation button images (for the top grey tabs, top pink tabs, and subnavigation background, and subnavigation button separators) and then you can implement the menu code. Do you have those images already?

[princealbert 0]

It is not a problem of images, if you take a look to the site (http://artifact.camille.pro/) it is operational : I just want to have a horizontal sub-menu instead of vertical one. I have been using CSS to style the submenu but I can't find the right class to do it !! Thanks, Camille

[kastelic 6]

Try this code:

	#primary-nav ul.sf-menu ul {width: 800px; left: -300px;}
	
	#primary-nav ul.sf-menu ul li {width: 150px;}

You'll definately have to play around with these and this style:

#primary-nav ul.sf-menu ul li a 

but this should get you closer to what your looking for.

[princealbert 0]

Hi every body, Still not find the right solution, still have sub-menu vertical http://artifact.camille.pro @Jimmy, your hint doesn't work, sub-menu move from left to right when I chose a category. I have read a lot : Superfish v1.4.8 jQuery menu plugin by Joel Birch Superfish navbar for Wordpress ... etc. But couldn't sort it out.I really really need the help of a developer, I must do a demonstration next Thursday (I'm desperate !!!) Thanks, Camille

[Kate 3]

Hi Alain - Try this:

#primary-nav ul.sf-menu ul {width:800px !important;}
	#primary-nav ul.sf-menu ul li{float:left;width:auto !important;}

If you have any issues with the main (body) area having a horizontal scroll, let us know and we can add some CSS for that too.

[princealbert 0]

Hi Kate, Thanks for your help, you can see the result of your code web site We getting closer but it is not yet what I'm looking for, here the design I must achieve home page : Animations tab I have to fixed the sub-menu on the left hand side of the web page. Thanks, Camille aKa Alain

[cmunns 16]

Okay, so at this point can you re-hash what else you need help with. It looks like the dropdowns are working great to me.

[princealbert 0]

Hi Adam if you look at the design I have sent you: the menu is stuck on the left of the page. On the website, to the point where I am: 1) The menu moves from left to right when you select the tabs parent 2) drop-down menu inherits parent style, and this is not what I want. I try to use the CSS rule :

#primary-nav ul.sf-menu ul { width: 740px !important; position: fixed !important; }

But it fixe the dropdown on page not underneath the main parent menu Thanks, Camille

[bryan-hadaway 3]

`body .main_nav{margin-left:60px}` Thanks, Bryan