CSS dropdowns with flyouts

  • brentjlaf
  • Student
  • Student
  • User avatar
  • Posts: 67

Post 3+ Months Ago

I am having a problem with the fly outs under the on the dropdown under the second tab on the top, any help would be appreciated.

Code: [ Select ]
<style>
#nav {
    position:absolute;
    top:127px;
    left:3px;
    margin:0;
    padding:0;
    list-style:none;
    font-size:13px;
    height:23px;
    visibility: visible;
}
#nav li {
    float:left;
    background:url(../images/bullet.gif) no-repeat 0 4px;
    padding:0 0 0 13px;
    margin:0 0 0 41px;
    display:inline;
    position:relative;
    height:23px;
}
#nav a {
    color:#0169a3;
    text-decoration:none;
}
#nav li ul a {
    display:block;
    width:200px;
}
#nav li ul {
    margin:0;
    padding:0;
    list-style:none;
    width:205px;
    position:absolute;
    top:22px;
    left:0;
    display:none;
    background:#e2e2e2;
    text-align:left;
    padding:0;
    /* border: 2px #fff solid; */
  visibility: visible;
}
#nav ul li {
    background:none;
    margin:0;
    padding:4px 8px 4px 8px;
    float:left;
    width:189px;
    line-height:20px;
}
#nav ul li:hover, #nav ul li.hover {
    background:#027cc5;
    border: 0px #fff solid;
}
#nav ul li:hover a, #nav ul li.hover a {
    color:#f2f2f2;
}
#nav li:hover ul, #nav li.hover ul {
    display:block;
}
#nav ul li ul li {
    margin:0;
    padding:0;
    list-style:none;
    width:205px;
    position:absolute;
    border:none;
    left: 205px;
    background:#e2e2e2;
}
</style>
  1. <style>
  2. #nav {
  3.     position:absolute;
  4.     top:127px;
  5.     left:3px;
  6.     margin:0;
  7.     padding:0;
  8.     list-style:none;
  9.     font-size:13px;
  10.     height:23px;
  11.     visibility: visible;
  12. }
  13. #nav li {
  14.     float:left;
  15.     background:url(../images/bullet.gif) no-repeat 0 4px;
  16.     padding:0 0 0 13px;
  17.     margin:0 0 0 41px;
  18.     display:inline;
  19.     position:relative;
  20.     height:23px;
  21. }
  22. #nav a {
  23.     color:#0169a3;
  24.     text-decoration:none;
  25. }
  26. #nav li ul a {
  27.     display:block;
  28.     width:200px;
  29. }
  30. #nav li ul {
  31.     margin:0;
  32.     padding:0;
  33.     list-style:none;
  34.     width:205px;
  35.     position:absolute;
  36.     top:22px;
  37.     left:0;
  38.     display:none;
  39.     background:#e2e2e2;
  40.     text-align:left;
  41.     padding:0;
  42.     /* border: 2px #fff solid; */
  43.   visibility: visible;
  44. }
  45. #nav ul li {
  46.     background:none;
  47.     margin:0;
  48.     padding:4px 8px 4px 8px;
  49.     float:left;
  50.     width:189px;
  51.     line-height:20px;
  52. }
  53. #nav ul li:hover, #nav ul li.hover {
  54.     background:#027cc5;
  55.     border: 0px #fff solid;
  56. }
  57. #nav ul li:hover a, #nav ul li.hover a {
  58.     color:#f2f2f2;
  59. }
  60. #nav li:hover ul, #nav li.hover ul {
  61.     display:block;
  62. }
  63. #nav ul li ul li {
  64.     margin:0;
  65.     padding:0;
  66.     list-style:none;
  67.     width:205px;
  68.     position:absolute;
  69.     border:none;
  70.     left: 205px;
  71.     background:#e2e2e2;
  72. }
  73. </style>








Code: [ Select ]
<ul id="nav">
 <li><a href="about-lanequinn.html">About Lane Quinn</a>
  <ul>
   <li><a href="corporate-profile.html">Corporate Profile</a></li>
   <li><a href="why-lane-quinn.html">Why Lane Quinn?</a></li>
   <li><a href="Presidents-message.html">President's Message</a></li>
   <li><a href="management-team.html">Management Team</a></li>
  </ul>
 </li>
 <li><a href="employee-benefit-services.html">Corporate Services</a>
  <ul>
   <li><a href="employee-benefits.html">Employee Benefits</a>
    <ul>
     <li><a href="health-care-spending-account.html">Health Care Spending Account</a></li>
     <li><a href="group-critical-illness-lnsurance.html">Group Critical Illness Insurance</a></li>
     <li><a href="best-doctors-elite-diagnostic-imaging-service.html">Best Doctors Elite Diagnostic Imaging Service</a></li>
     <li><a href="employee-and-family-assistance-program.html">Employee and Family Assistance Program</a></li>
     <li><a href="group-retirement-programs.html">Group Retirement Programs (IPP, Group RSPS, DPSP, RPP, DC, DB)</a></li>
    </ul>
   </li>
   <li><a href="#">Executive Top-up Programs</a>
    <ul>
     <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a> </li>
     <li><a href="disability-top-up.html">Disability Top-up</a> </li>
     <li><a href="private-health-services.html">Private Health Services (HCSA)</a> </li>
    </ul>
   </li>
   <li><a href="#">Individual Products</a>
    <ul>
     <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
     <li><a href="life-insurance.html">Life Insurance</a> </li>
     <li><a href="key-man-insurance">Key-Man Insurance</a> </li>
     <li><a href="disability-insurance.html">Disability Insurance</a> </li>
     <li><a href="health-and-dental-insurance">Health and Dental Insurance</a></li>
     <li><a href="travel-insurance.html">Travel Insurance</a> </li>
     <li><a href="long-term-care-insurance.html">Long Term Care Insurance</a> </li>
     <li><a href="medical-access.html">Medical Access</a> </li>
     <li><a href="buy-sell-Insurance.html">Buy-Sell Insurance</a> </li>
    </ul>
   </li>
   <li><a href="#">International Coverage</a>
    <ul>
     <li><a href="individualtravel.html">Individual Travel</a> </li>
     <li><a href="group-travel.html">Group Travel</a> </li>
     <li><a href="inpatriate-coverage.html">Inpatriate Coverage (New Canadian)</a> </li>
     <li><a href="expatriate-coverage.html">Expatriate Coverage</a> </li>
     <li><a href="family-coverage.html">Family Coverage</a> </li>
    </ul>
   </li>
   <li><a href="retirement-programs.html">Retirement Programs</a></li>
  </ul>
 </li>
 <li> <a href="#">Affiliated Services</a>
  <ul>
   <li><a href="our-affiliates">Our Affiliates</a></li>
   <li><a href="estate-planning.html">Estate Planning</a></li>
   <li><a href="executive-compensation.html">Executive Compensation</a></li>
   <li><a href="wealth-strategy.html">Wealth Strategy</a></li>
  </ul>
 </li>
 <li><a href="employee-benefit-solutions.html">Innovative Solutions</a>
  <ul>
   <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
   <li><a href="travel-insurance.html">Travel Insurance</a></li>
   <li><a href="best-doctor-diagnostic.html">Best Doctor Diagnostic</a></li>
   <li><a href="employee-assistance-programs.html">Employee Assistance Programs</a></li>
   <li><a href="exective-disability-programs.html">Executive Disability Programs</a></li>
   <li><a href="health-care-spending-accounts.html">Health Care Spending Accounts</a></li>
  </ul>
 </li>
 <li><a href="benefit-resources.html">Resources</a>
  <ul>
   <li><a href="request-travel-insurance.html">Request Travel Insurance</a></li>
   <li><a href="individual-health-dental-insurance-plans.html">Health &amp; Dental Inurance Plans</a></li>
   <li><a href="helpful-links.html">Helpful Links</a></li>
  </ul>
 </li>
 <li><a href="contact-lanequinn.html">Contact Us</a></li>
</ul>
  1. <ul id="nav">
  2.  <li><a href="about-lanequinn.html">About Lane Quinn</a>
  3.   <ul>
  4.    <li><a href="corporate-profile.html">Corporate Profile</a></li>
  5.    <li><a href="why-lane-quinn.html">Why Lane Quinn?</a></li>
  6.    <li><a href="Presidents-message.html">President's Message</a></li>
  7.    <li><a href="management-team.html">Management Team</a></li>
  8.   </ul>
  9.  </li>
  10.  <li><a href="employee-benefit-services.html">Corporate Services</a>
  11.   <ul>
  12.    <li><a href="employee-benefits.html">Employee Benefits</a>
  13.     <ul>
  14.      <li><a href="health-care-spending-account.html">Health Care Spending Account</a></li>
  15.      <li><a href="group-critical-illness-lnsurance.html">Group Critical Illness Insurance</a></li>
  16.      <li><a href="best-doctors-elite-diagnostic-imaging-service.html">Best Doctors Elite Diagnostic Imaging Service</a></li>
  17.      <li><a href="employee-and-family-assistance-program.html">Employee and Family Assistance Program</a></li>
  18.      <li><a href="group-retirement-programs.html">Group Retirement Programs (IPP, Group RSPS, DPSP, RPP, DC, DB)</a></li>
  19.     </ul>
  20.    </li>
  21.    <li><a href="#">Executive Top-up Programs</a>
  22.     <ul>
  23.      <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a> </li>
  24.      <li><a href="disability-top-up.html">Disability Top-up</a> </li>
  25.      <li><a href="private-health-services.html">Private Health Services (HCSA)</a> </li>
  26.     </ul>
  27.    </li>
  28.    <li><a href="#">Individual Products</a>
  29.     <ul>
  30.      <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
  31.      <li><a href="life-insurance.html">Life Insurance</a> </li>
  32.      <li><a href="key-man-insurance">Key-Man Insurance</a> </li>
  33.      <li><a href="disability-insurance.html">Disability Insurance</a> </li>
  34.      <li><a href="health-and-dental-insurance">Health and Dental Insurance</a></li>
  35.      <li><a href="travel-insurance.html">Travel Insurance</a> </li>
  36.      <li><a href="long-term-care-insurance.html">Long Term Care Insurance</a> </li>
  37.      <li><a href="medical-access.html">Medical Access</a> </li>
  38.      <li><a href="buy-sell-Insurance.html">Buy-Sell Insurance</a> </li>
  39.     </ul>
  40.    </li>
  41.    <li><a href="#">International Coverage</a>
  42.     <ul>
  43.      <li><a href="individualtravel.html">Individual Travel</a> </li>
  44.      <li><a href="group-travel.html">Group Travel</a> </li>
  45.      <li><a href="inpatriate-coverage.html">Inpatriate Coverage (New Canadian)</a> </li>
  46.      <li><a href="expatriate-coverage.html">Expatriate Coverage</a> </li>
  47.      <li><a href="family-coverage.html">Family Coverage</a> </li>
  48.     </ul>
  49.    </li>
  50.    <li><a href="retirement-programs.html">Retirement Programs</a></li>
  51.   </ul>
  52.  </li>
  53.  <li> <a href="#">Affiliated Services</a>
  54.   <ul>
  55.    <li><a href="our-affiliates">Our Affiliates</a></li>
  56.    <li><a href="estate-planning.html">Estate Planning</a></li>
  57.    <li><a href="executive-compensation.html">Executive Compensation</a></li>
  58.    <li><a href="wealth-strategy.html">Wealth Strategy</a></li>
  59.   </ul>
  60.  </li>
  61.  <li><a href="employee-benefit-solutions.html">Innovative Solutions</a>
  62.   <ul>
  63.    <li><a href="critical-illness-insurance.html">Critical Illness Insurance</a></li>
  64.    <li><a href="travel-insurance.html">Travel Insurance</a></li>
  65.    <li><a href="best-doctor-diagnostic.html">Best Doctor Diagnostic</a></li>
  66.    <li><a href="employee-assistance-programs.html">Employee Assistance Programs</a></li>
  67.    <li><a href="exective-disability-programs.html">Executive Disability Programs</a></li>
  68.    <li><a href="health-care-spending-accounts.html">Health Care Spending Accounts</a></li>
  69.   </ul>
  70.  </li>
  71.  <li><a href="benefit-resources.html">Resources</a>
  72.   <ul>
  73.    <li><a href="request-travel-insurance.html">Request Travel Insurance</a></li>
  74.    <li><a href="individual-health-dental-insurance-plans.html">Health &amp; Dental Inurance Plans</a></li>
  75.    <li><a href="helpful-links.html">Helpful Links</a></li>
  76.   </ul>
  77.  </li>
  78.  <li><a href="contact-lanequinn.html">Contact Us</a></li>
  79. </ul>
  • Anonymous
  • Bot
  • No Avatar
  • Posts: ?
  • Loc: Ozzuland
  • Status: Online

Post 3+ Months Ago

Post Information

  • Total Posts in this topic: 1 post
  • Users browsing this forum: No registered users and 70 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.