Jump to content


  • Content Count

  • Joined

  • Last visited

Community Reputation

0 Neutral

About crossbeats

  • Rank
  1. Apparently I can't post HTML and CSS in the same post? Here's the CSS: /* Menu */nav {height: 60px;margin: auto;text-align: center;}nav ul ul {display: none; } nav ul li:hover > ul {display: block;}nav ul {width: 950px;z-index: 101;background: #efefef;background: linear-gradient(top, #efefef 0%, #bbbbbb 100%);background: -moz-linear-gradient(top, #efefef 0%, #bbbbbb 100%);background: -webkit-linear-gradient(top, #efefef 0%,#bbbbbb 100%); box-shadow: 0px 0px 9px rgba(0,0,0,0.15);list-style: none;position: relative;display: inline-table;padding: auto;margin: 0 5px 0 -5px; }nav ul:after {content: ""; clear: both; display: block;}nav ul li {height: 30px;float: left;margin: auto;padding: auto;position: relative;}nav ul li:hover {background: #263a79;background: linear-gradient(top, #263a79 0%, #10225b 40%);background: -moz-linear-gradient(top, #263a79 0%, #10225b 40%);background: -webkit-linear-gradient(top, #263a79 0%,#10225b 40%);}nav ul li:hover a { color: #fff;} nav ul li a {height: 30px;margin: 0;display: block;padding: 5px 50px;color: #263a79; text-decoration: none;float: left;}nav ul ul {background: #263a79;border-radius: 0px;padding: 0 -2px 0 -2px;position: absolute;top: 100%;margin: 0 -0.5px 0 0.5px;width: auto;}nav ul ul li {height: auto;float: left; border-top: 1px solid #6b727c;border-bottom: 1px solid #575f6a;position: relative;z-index: 101;overflow: hidden; }nav ul ul li a { height: auto; padding: auto; color: #fff; float: left;} nav ul ul li a:hover { height: auto; background: linear-gradient(top, #263a79 0%, #10225b 40%); padding: auto; width: auto; } nav ul ul ul {position: absolute; left: 100%; top:0;}
  2. I started working for a new company and am trying to clean up the mess of code that was left behind and (unfortunately) I think in my attempts I've made a bigger mess. The main issue I'd like to fix is the hover effects on the Nav bar The Accessories dropdown doesn't line up with "Products" above it, and the hover effect on "Contact" doesn't go all the way to the edge of the nav bar. Code is as follows: HTML: <nav><ul><li><a href="index.htm">Home</a></li><li><a href="products.htm">Products</a><ul><li><a href="accessories.htm">Accessories</a></li></ul></li> <li><a href="clearance.htm">Clearance</a></li><li><a href="requestinfo.htm">Request Info</a></li><li><a href="about.htm">About PACE</a><ul><li><a href="news.htm">News & Events</a></li></ul></li><li><a href="contacts.htm">Contact</a></li></ul></nav>
  • Create New...