CODEWITHSUNDEEP
htmlcssdrop-down-menusuperfish
Klikster
Klikster

Reputation: 1164

Dropdown (Superfish) menuworks in IE, broken in FF / Chrome?

Website: http://soizimage.com/mrmstory.html

For some strange reason it's broken in Firefox and Chrome, but works perfectly in IE.

I'm not sure if it's just the submenu <ul> or something else?

Help is appreciated, thanks!

Upvotes: 0

Views: 427

Answers (3)

user1141887
user1141887

Reputation:

Your <ul> is currently sitting outside of the <li> it should be a child of.

<ul>
 <li>Link</li>
  <ul><li>Child Link</li></ul> *Dropdown*

It should be:

<ul>
 <li>Link
  <ul><li>Child Link</li></ul> *Dropdown*
 </li>

Upvotes: 1

Rob
Rob

Reputation: 15150

The problem is IE. While it may show what you want, the more modern browsers show what you wrote.

You have "stuff" before the doctype. If you put anything before the doctype, it throws IE into 'quirks mode'. Remove all that and put it in the head or body where it belongs.

Specifically, the script stuff should (probably) go in the head while the anchor, I don't know exactly where, but it should go in the body.

And the list thing everyone else mentioned, too.

Upvotes: 1

Andres I Perez
Andres I Perez

Reputation: 75379

You're not properly nesting your submenu <ul> under the your "Red Thread" menu item:

<li class="newwork"><a href="newwork.html"><span>New Series</span></a></li> //li item closes here
<ul>
    <li><a href="new-gallery.html">SERIES 1</a></li>
    <li><a href="new-gallery2.html">SERIES 2</a></li>

      <!--
    <li><a href="newworkseries3-gallery.html">SERIES 3</a></li>     
    <li><a href="newworkseries4-gallery.html">SERIES 4</a></li>
       -->                                                                     
</ul>

Include that submenu inside your menu item and it should work fine, like so:

<li class="newwork"><a href="newwork.html"><span>New Series</span></a>
    <ul>
        <li><a href="new-gallery.html">SERIES 1</a></li>
        <li><a href="new-gallery2.html">SERIES 2</a></li>

          <!--
        <li><a href="newworkseries3-gallery.html">SERIES 3</a></li>     
        <li><a href="newworkseries4-gallery.html">SERIES 4</a></li>
           -->                                                                     
    </ul>
</li>

Upvotes: 1

Related Questions