View Full Version : Dropdown Menu help

05-18-2012, 04:16 PM

Apologies for the simple question!

I am trying to change some css code for an existing drop-down menu.

At present the code displays the ul invisible sub menu by appearing directly below the text/href.

I'd rather the list not all appear below, but be spread out in one line or "row" - in the line directly below the link.

I'm sure this is easy but not sure where to make this change.


05-18-2012, 05:57 PM
With out code, I guess this:


05-19-2012, 03:56 PM
Hello mashtonsmith,
For a more specific answer, it would really help to see the code you're working with.

Looking at this example (http://nopeople.com/CSS%20tips/new_empty-menu18_dropdown-flyout/index.html) for some ideas may help.

05-21-2012, 11:32 AM
Sorry - code follows..

#navbar {
color: rgb(0, 145, 171);
font-size: 16px;
margin: 18px 24px 24px 24px;
#navbar ul {
margin: 0;
padding: 0;
list-style-type: none;
#navbar li {
float: left;
position: relative;
margin: 0;
#navbar ul a {
text-transform: uppercase;
height: 32px;
color: rgb(0, 145, 171);
line-height: 30px;
padding-right: 48px;
text-decoration: none;
display: block;
#navbar a:hover {
color: rgb(84, 84, 84);
text-decoration: none;
z-index: 100;
#navbar ul ul {
position: absolute;
left: -6px;
top: 32px;
visibility: hidden;
#navbar ul ul a {
padding: 5px;
width: 200px;
height: auto;
color: rgb(84, 84, 84);
text-transform: capitalize;
line-height: 1.4em;
z-index: 100;
#navbar ul ul a:hover {
color: rgb(128, 128, 128);
z-index: 100;
#navbar ul li:hover ul {
visibility: visible;