Solved

CSS Dropdown Menu

Posted on 2013-01-23
3
236 Views
Last Modified: 2013-02-13
I'm normally really good at this but for some reason, I can't get it to work correct.
I have a vertical menu.  At the first ul ul I need <li>to drop straight down and push all of the other menu choices down. However, at the third ul /  <ul><ul><ul> I need the li's to push out to the right.  Can someone give me the brief CSS to make this happen.

<ul>
	<li>ONE</li>
	<li>TWO	
		<ul>
			<li>TWO A</li>
				<ul>
					<li>TWO B</li>
					<li>TWO BB</li>
					<li>TWO BBB</li>
				</ul>
			<li>TWO AA</li>
		</ul>
	</li>
	<li>THREE</li>
	<li>FOUR</li>
</ul>

Open in new window

0
Comment
Question by:rgranlund
  • 2
3 Comments
 
LVL 53

Expert Comment

by:COBOLdinosaur
ID: 38811142
You are not showing the CSS so I will have to make a guess.  The part that needs to push out to the right needs either display:inline or display:inline-block


Cd&
0
 
LVL 7

Author Comment

by:rgranlund
ID: 38811215
This is all I have.  Can you add a littl more to it so the first level drops down and then the next goes out to the right?

nav ul	{
	display:block;
	width:140px;
	padding:11px 0px 13px 0px;
}

nav li	{
	width:140px;
	display:inline;
	list-style:none;
}


nav ul li a	{
	height:10%;
	padding:0% 0% 0% 5%;
	color:#908f8f;
	font-family:Arial, Helvetica, sans-serif;
	font-size:1em;
	text-decoration:none;
	display:block;
}

nav ul li a:hover	{
	color:#ffffff;
}

nav ul ul  {
visibility:hidden:
}

Open in new window

0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
ID: 38811766
nav ul ul ul>li {display:inline;}

perhaps.  It would probably easier if you posted a link so I could play with it.

Cd&
0

Featured Post

Active Directory Webinar

We all know we need to protect and secure our privileges, but where to start? Join Experts Exchange and ManageEngine on Tuesday, April 11, 2017 10:00 AM PDT to learn how to track and secure privileged users in Active Directory.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
In this tutorial viewers will learn how to style a corner ribbon overlay for an image using CSS Create a new class by typing ".Ribbon":  Define the class' "display:" as "inline-block": Define its "position:" as "relative": Define its "overflow:" as …
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

828 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question