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

437 Views Asked by At

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!

3

There are 3 best solutions below

1
On BEST ANSWER

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>
0
On

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.

0
On

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>