I am trying to figure how to create a dropdown menu like this?


This is the original menu

(I'm trying to figure out both how to write the codes for dropdown menu as well as the css appearance)

Recommended Answers

All 5 Replies

Have you tried your browsers editing tools? You can view the source with it.

Yes Michael is right.If you are clear about your webpage design,then just see the source of page and just by editting some lines ,you will be ready to use it.

What's this code means?


#cssmenu > ul > li > a {


#cssmenu > ul > li > a {
        color: rgb(160,160,160);
        font-family: Verdana, 'Lucida Grande';
        font-size: 15px;
        line-height: 70px;
        padding: 15px 20px;
    -webkit-transition: color .15s;
       -moz-transition: color .15s;
         -o-transition: color .15s;
            transition: color .15s;


 #cssmenu > ul > li > a {

Selects anchor elements where its parent is a list item element where its parent is an unordered list where its parent is an element with an ID of cssmenu.

Where that matches, apply the styles listed.

 #cssmenu > ul > li > a {

It means there is an id cssmenu .Inside this id "cssmenu" there is an element ul,inside that li and for "a" use following css.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.