-1

I have a problem with my dropdown or submenu. It worked perfectly fine before, but after I changed my menu to be floating, the submenu won't show anymore. this is the code I used for menu:

border-bottom:2px solid #e9e9e9;
position:fixed;
width:2000px;
background-color:#ffffff;
padding-left:605px;
padding-right:210px;
margin-right:-200px;

And this is my website http://lobaab.com/ could you help me on how to fix this plz

Maryam S
  • 23
  • 9

1 Answers1

0

Nested ULs are hidden by display: none in the default state, and you never change this property to block.

.sf-menu li:hover > ul {
    display: block !important; /* importnat isn't necessary if you know how strong selector you need to use */
}

Than, you set width: 100% for submenu, but it´s width of their parent (LI). You want probably set higher width, or don´t set the width exactly and use only white-space: nowrap - submenu will have the width of the longest item.

pavel
  • 26,538
  • 10
  • 45
  • 61
  • Thank you for your answer. so I set the display to block. but I didn't understand the second part. – Maryam S Nov 22 '14 at 16:55
  • It was just recommendation. If I understood your CSS file correctly, you works with `width: 100%` for submenus, it means 100% of parent (li), what is +-80px. If you have longer texts in submenu, you will have them on two, three lines instead of one. You can ignore the rest of my answer, really interestign for you is the first part, the second one maybe later - when you'll see the submenus :-) – pavel Nov 22 '14 at 17:01