Jump to content

webwags

Members
  • Posts

    5
  • Joined

  • Last visited

webwags's Achievements

Newbie

Newbie (1/7)

0

Reputation

  1. Yes, I seem to be totally confused with submenus these days. I would like the drop down to have the same width. Any suggestions so I can try to understand what I am not understanding! Lol!
  2. Hi there, I am having trouble understanding how to format the width of my submenu items in my nav bar. I have tried mulitple codes and am at a loss. Any suggestions? <nav id="navbar_text"> <ul> <li><a href="index.html">Home</a></li> <li><a href="aboutus.html">About</a></li> <li><a href="products.html">Products</a> <ul class="submenu"> <li><a href="fireplace.html">Fireplaces & Accessories</a></li> <li><a href="fireplacedoors.html">Fireplaces Doors</a></li> <li><a href="inserts.html">Fireplaces Inserts</a></li> <li><a href="stoves.html">Stoves</a></li> <li><a href="outdoorkitchens.html">Outdoor Kitchens</a></li> <li><a href="gasgrills.html">Gas Grills</a></li> </ul> </li> <li><a href="services.html">Services</a> <ul class="submenu"> <li><a href="chimney_services.html">Chimney Services</a></li> <li><a href="gas_services.html">Gas Services</a></li> <li><a href="custom_design.html">Custom Design</a></li> </ul> </li> </ul> </nav> #navbar_text a:link{ color: #bca380; } #navbar_text a:hover{ color: #dccfbd; } #navbar_text { word-spacing: 15px; } #navbar_text li{ position: relative; display:inline; } #navbar_text ul li a { display:inline; padding: 5px; background: #663333; margin-top: 5px; font-family:Georgia, "Times New Roman", Times, serif; font-size: 150%; color: #bca380; text-decoration: none; } ul.submenu { display: none; position: absolute; top: -9999em; left: 0; } li:hover ul.submenu { padding: 0; margin: 0; list-style: none; line-height: 20px; display: list-item; font-size: 70%; top: 20px; }
  3. thank you, I understand the theory behind this and applied it and it worked great. One problem though, I am unable to select the links under the submenu. What am I missing?
  4. I am trying to style my submenu. Having trouble getting the submenu links to stay under the correct main heading. Any help would be greatly appreciated. I am very new to this, so please forgive my elementary quesiton. Thankyou.
  5. <div id="navbar"> <nav id="navbar_text"> <ul> <li><a href="index.html">Home</a></li> <li><a href="aboutus.html">About</a></li> <li><a href="products.html">Products</a> <ul class="submenu"> <li><a href="fireplace.html">Fireplaces & Accessories</a></li> <li><a href="stoves.html">Stoves</a></li> <li><a href="outdoorkitchens.html">Outdoor Kitchens</a></li> <li><a href="gasgrills.html">Gas Grills</a></li> </ul> </li> <li><a href="services.html">Services</a> <ul class="submenu"> <li><a href="chimney_services.html">Chimney Services</a></li> <li><a href="gas_services.html">Gas Services</a></li> <li><a href="custom_design.html">Custom Design</a></li> </ul> </li> </ul> </nav> </div> <!--END navbar--> #navbar_text a:link{ color: #bca380; } #navbar_text a:hover{ color: #dccfbd; } #navbar_text { word-spacing: 15px; } #navbar_text li{ display:inline; } #navbar_text ul li a { display:inline; padding: 5px; background: #663333; margin-top: 5px; font-family:Georgia, "Times New Roman", Times, serif; font-size: 150%; color: #bca380; text-decoration: none; } ul.submenu { display: none; } li:hover ul.submenu { padding: 0; margin: 0; list-style: none; line-height: 25px; display: list-item; width: 100px; font-size: 70% } #sidebar ul li a { display: block; padding: 10px 10px 10px 15px; background: #cab69a; -webkit-border-radius: 8px 0px 0px 8px; border-radius: 8px 0px 0px 8px; margin-top: 10px; font-family:Georgia, "Times New Roman", Times, serif; font-size: 120%; font-weight: bold; color: #663333; text-decoration: none; -webkit-box-shadow: 4px 4px 5px rgba(181, 154, 115, 0.75); -moz-box-shadow: 4px 4px 5px rgba(181, 154, 115, 0.75); box-shadow: 4px 4px 5px rgba(181, 154, 115, 0.75); } nav ul { list-style:none; } #navbar { background: #663333; height: 35px; width: 940px; padding: 10px 0px 0px 20px; } submenu test.html submenu test.css
×
×
  • Create New...