Search the Community

I am attempting to create a drop down menu and I liked the style of the top home menu seen here http://www.lego.com/en-us/products (right near the lego symbol) but I am not sure how to create a similar one would some one gI've me guidance on how I can do this I just started html coding so I am a noon with little knowledge of html right now.

Hello there, I have a main nav with some drop down elements, but the way this particular menu is coded the main btn for the catergory isn't clickable. It has a rollover state that allows the drop down menu to appear and there is a spot to insert a link, but I just can't seem to get that main btn to be clickable. (there's also "secondary" drop out menus within the drop down menus that basically have the same issue of not being clickable) Here is a link to the site as is at the moment: http://sierraelectronics.oiw10.com And here is the code being used for a drop down section of the first btn in the main nav (with multiple columns): <div class="navbar-cell stretch"> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-2"> <div class="navbar-cell"> <ul class="nav navbar-nav navbar-right"> <li class="dropdown yamm-fw"><a href="#" data-toggle="dropdown" class="dropdown-toggle">Commercial <b class="fa fa-angle-down"></b></a> <ul class="dropdown-menu"> <li> <div class="yamm-content"> <div class="row"> <div class="col-md-3 col-xs-12 nopadding"> <div class="box"> <ul> <li><a href="/motorola/index.htm">Commercial Radios</a> <li><a href="/motorola/accessories/index.htm">Accessories</a></li> <li><a href="/motorola/dispatch-consoles.htm">Dispatch / Consoles</a></li> <li><a href="/motorola/mobile-radios.htm">Mobile Radios</a></li> <li><a href="/motorola/portable-radios.htm">Portable Radios</a></li> <li><a href="/motorola/mototrbo/repeaters.htm">Repeaters</a></li> </ul> </div><!-- end box --> </div><!-- end col --> <div class="col-md-3 col-xs-12 nopadding"> <div class="box"> <ul> <li><a href="/motorola/mototrbo/index.htm">MOTOTRBO Digital</a> <li><a href="/motorola/mototrbo/why-digital.htm">Why Digital Two-Way</a></li> <li><a href="/motorola/mototrbo/hear-the-difference.htm">Hear The Difference</a></li> <li><a href="/motorola/mototrbo/system-equipment.htm">Equipment Portfolio</a></li> <li><a href="/motorola/mototrbo/portable-radios.htm">MOTOTRBO Portables</a></li> <li><a href="/motorola/mototrbo/mobile-radios.htm">MOTOTRBO Mobiles</a></li> <li><a href="/motorola/mototrbo/repeaters.htm">MOTOTRBO Repeaters</a></li> <li><a href="/motorola/mototrbo/mototrbo-systems.htm">MOTOTRBO Systems</a></li> <li><a href="/motorola/mototrbo/wave3000.htm">WAVE (PTT)</a></li> </ul> </div><!-- end box --> </div><!-- end col --> <div class="col-md-3 col-xs-12 nopadding"> <div class="box"> <ul> <li><a href="/motorola/mototrbo/applications/index.htm">MOTOTRBO Applications</a></li> <li><a href="/motorola/mototrbo/applications/command-and-control.htm">Command and Control</a></li> <li><a href="/motorola/mototrbo/applications/email-and-text.htm">Email and Text</a></li> <li><a href="/motorola/mototrbo/applications/interoperability.htm">Interoperability</a></li> <li><a href="/motorola/mototrbo/applications/location.htm">Location </a></li> <li><a href="/motorola/mototrbo/applications/personnel-safety.htm">Personnel Safety</a></li> <li><a href="/motorola/mototrbo/applications/system-monitoring.htm">System Monitoring</a></li> <li><a href="/motorola/mototrbo/applications/voice-dispatch.htm">Voice Dispatch</a></li> <li><a href="/motorola/mototrbo/applications/work-ticket-management.htm"> Work Ticket Management</a></li> </ul> </div><!-- end box --> </div><!-- end col --> <div class="col-md-3 col-xs-12 nopadding"> <div class="box"> <ul> <li><a href="/motorola/in-building-solutions.htm">In Building Solutions</a></li> <li><a href="/WAVE/index.htm">Voice Applications</a></li> <li><a href="/radio-selector-guide/index.htm">Radio Selector Guide</a></li> <li><a href="/motorola/accessories/featured/index.htm">Featured Accessories</a></li> <li><a href="/current-promotions.htm">Current Promotions</a></li> </ul> </div><!-- end box --> </div><!-- end col --> </div><!-- end row --> </div><!-- end yamm-content --> </li> </ul> </li> (following code to complete main nav) And here is the code being used for a drop down section of the main nav (with one column): <li class="dropdown has-submenu"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-expanded="false">Industries <span class="fa fa-angle-down"></span></a> <ul class="dropdown-menu start-left" role="menu"> <li><a href="/industry-solutions/construction.htm">Construction</a></li> <li><a href="/industry-solutions/education.htm">Education</a></li> <li><a href="/industry-solutions/gaming.htm">Gaming</a></li> <li><a href="/industry-solutions/government-services.htm">Government</a></li> <li><a href="/industry-solutions/healthcare.htm">Healthcare</a></li> <li><a href="/industry-solutions/hospitality-retail.htm">Hospitality and Retail</a></li> <li><a href="/industry-solutions/manufacturing.htm">Manufacturing</a></li> <li><a href="/industry-solutions/public-safety.htm">Public Safety</a></li> <li><a href="/industry-solutions/transportation-logistics.htm">Transportation</a></li> <li><a href="/industry-solutions/utilities.htm">Utilities and Energy</a></li> <li><a href="/industry-solutions/index.htm">Industries Home</a></li> </ul></li> I hope this makes sense. Any and all help would be greatly appreciated! Thanks in advanced, m@

Hi, I m trying to use drop down menu widget of this site http://www.menucool.com/drop-down-menu in my site egtours.com But I try to make some change, it does not work since my page use online site builder soho site builder. I want to ask if some body can make above menu compatible to my site, I can give further information required.

hey guys please l need help with my css drop down menu.l got the 1 level drop down right but cant seem to be able to add the 2 nd level. this is the code html <ul id="navbar" > <li><a href="#">HOME</a></li> <li><a href="#">COMPANY</a></li> <li><a href="#">PRODUCTS</a> <ul> <li><a href="#">Steel Profile</a></li> <li><a href="#">Steel Pipe</a> <ul> <li><a href="#">welded steel pipe</a></li> <li><a href="#">seamless steel pipe</a></li> </ul> </li> <li><a href="#">Steel Coil</a></li> </ul> </li> <li><a href="#">PROFILE</a></li> <li><a href="#">SALES NETWORK</a></li> <li><a href="#">CONTACTS</a></li> <li> </ul> css #navbar { margin: 0; padding: 0; height: 1em; } #navbar li { list-style: none; float: left; } #navbar li a { display: block; padding: 3px 8px; background-color: #5e8ce9; color: #fff; text-decoration: none; } #navbar li ul { display: none; width: 10em; /* Width to help Opera out */ background-color: #69f;} #navbar li:hover ul { display: block; position: absolute; margin: 0; padding: 0; } #navbar li:hover li { float: none; } #navbar li:hover li a { background-color: #69f; border-bottom: 1px solid #fff; color: #000; } #navbar li li a:hover { background-color: #8db3ff; } #navbar li li ul { display:none; } #navbar li li:hover ul { display:block; left:150px; margin-top: -1.5em; } #navbar li li:hover li { float:right; } thanks for your help

Hi all, I am currently brushing up on some skills, and I've run into an issue. I'm working with a double line van menu, and I want to include drop downs throughout the menue. The drop downs are ok for the bottom line, but the top line is having some issues. I've attached the file I'm working with. Bonus to anyone who can help me get the css styling the first level of the nav to stop affecting the second level. Thanks,Rebecca index2.html