Spry menu positioning problem in Internet Explorer

Hi everyone,
My website is working fine in Firefox and Chrome, but my spry menu doesn't show up correctly in IE 8. When I view the site in IE, the spry menu shows up as a white rectangle and the submenus appear too high up on the page. If anyone could help me figure out how to fix this, that would be great.
I noticed that in Firefox/chrome, the positioning of the submenus starts counting from the top of the spry menu (40px down), but in IE it seems to start counting from the top of the page?
Here's a link to my website: http://www.student.kuleuven.be/~s0183195/index.html
I'm using the latest version of spry.
Thanks for your time,
Tine

That's much better, thank you!
However, the submenus still appear too far to the right side. When I do a local preview in IE via Dreamweaver everything looks fine, but when I upload my files and view the site online the submenus appear under the word next to the selected word.
Thanks!
Edit: I just noticed that if I turn off the compatibility view in IE, the submenus appear as they should. Is there a way to make them appear correctly with the compatibility view turned on as well?

Similar Messages

  • Spry Alignment and Positioning Problem in Internet Explorer 6 and 7

    I am designing a website at http://atoment.007gb.com, and neither me, nor my partner can figure out why the Spry Horizontal Menu Bar is loading the way it is in Internet Explorer.  We are doing this for a school project, and eye appeal and workability is a top priority.  I changed and customized most of it, but even if i did keep it the same, it still wouldn't work. I have only the best confidence, that even given the amount i have changed, you will still be able to help me with my alignment problem.
    The Submenu Buttons Tile across the page, when they are supposed to go straight down...
    the Submenu overlaps the main menu when you hover over it
    and the darned thing wont center in any of my browsers, but thats the least of my worries.
    Here is the CSS Codes
    #MasterNavigator {
    width: 1024px;
    height: 75px;
    #Navigator {
    margin-left: auto;
    margin-right: auto;
    clear: both;
    #NavigatorButtonsLeft  {
    background-image: url(../_images/MenuButtonBackgroundLeft.png);
    width: 128px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    vertical-align:center;
    #NavigatorButtonsMiddle {
    background-image: url(../_images/MenuButtonBackground.png);
    width: 128px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    vertical-align:center;
    #NavigatorButtonsRight {
    background-image: url(../_images/MenuButtonBackgroundRight.png);
    width: 128px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    vertical-align:center;
    #NavigatorButtonsSub {
    background-image:url(../_images/SubMenuButtonBackground.png);
    width: 128px;
    height: 35px;
    line-height: 36px;
    text-align: center;
    filter:alpha(opacity=80);
    -moz-opacity:0.8;
    -khtml-opacity: 0.8;
    opacity: 0.8;
    And here is my HTML code:
    Home
    Publishing
    Videos
    Patents
    Wallpapers
    Avatars
    Userbars
    Digital Design
    Digital Gallery
    3-D Gallery
    Sci-Fi
    Technology
    Structures
    Vehicles
    Concepts
    Web Design
    Templates
    Graphics
    About Us    
    Atom Enterprises
    Slamerz
    The images I used are 20% Transparent, and are listed below.
    http://atoment.007gb.com/_images/MenuButtonBackgroundLeft.png
    http://atoment.007gb.com/_images/MenuButtonBackground.png
    http://atoment.007gb.com/_images/MenuButtonBackgroundRight.png
    http://atoment.007gb.com/_images/SubMenuButtonBackground.png
    Please try your best to help me.

    0087adam wrote:
    ok, but how can I make it work with what I have.  All the css codes are the
    same, they just have been renamed.
    The original SpryMenuBarHorizontal.css does not have any issues in any of the browsers. If you go and modify the original, and it does not work anymore, then the logical conclusion is that you have made one or (more likely) multiple mistakes.
    In other words, you cannot make it work with what you already have.
    My advice is that you replace the original CSS and work from there; but instead of changing the original CSS, make your changes in a separate stylesheet so that you can monitor and test the code at each change. For instance if you want to change the colour of the text you make a style rule that overrides the original in your new stylesheet as follows:
    ul.MenuBarHorizontal a {
        color: #333;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus {
        color: #FFF;
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible {
        color: #FFF;
    If you want to change the background colour to an image, then follow the same procedure, testing your code at each step.
    I hope this helps.
    Ben

  • Spry Menu screwing up in Internet Explorer

    My site works perfectly in Chrome and Safari, but in Internet Explorer, the spry menu goes behind a video I have on my home page when it drops down. Again, this doesn't happen with Chrome or Safari. Is this just an IE bug that people often have a problem with? Is it fixable? Here is my code:
    Home Page HTML Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Proud2BCatholic : Home</title>
    <link rel="shortcut icon" href="Images/favicon.ico" />
    <link href="Proud2BCatholic_Final.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
    <div id="container">
    <div id="home_header"> <img src="Images/P2BC Header.jpg" width="999" height="200" /></div>
    <ul id="MenuBar1" class="MenuBarHorizontal">
      <li><a href="home.html" target="_self">Home</a></li>
      <li><a class="MenuBarItemSubmenu" href="#">Catholic Faith</a>
        <ul>
          <li><a href="prayers.html" target="_self">Prayers</a></li>
          <li><a href="novenas.html" target="_self">Novenas</a></li>
          <li><a href="devotions.html" target="_self">Devotions</a></li>
          <li><a href="saints.html" target="_self">Saints</a></li>
          <li><a href="mary.html" target="_self">Mary</a></li>
          <li><a href="sacraments.html" target="_self">Sacraments</a></li>
        </ul>
    </li>
    <li><a href="videos.html" target="_self">Videos</a></li><li><a href="resources.html" target="_self">Resources</a></li>
        <li><a href="blogs.html" target="_self">Blogs</a></li>
        <li><a href="#" class="MenuBarItemSubmenu">College Tips</a>
          <ul>
            <li><a href="dosanddonts.html" target="_self">Do's and Don'ts</a></li>
            <li><a href="collegesuccess.html" target="_self">College Success</a></li>
            <li><a href="findingafit.html" target="_self">Finding a Fit</a></li>
    <li><a href="whycollege.html" target="_self">Why College?</a></li>
          </ul>
        </li>
        <li><a class="MenuBarItemSubmenu" href="#">Scholarships</a>
          <ul>
    <li><a href="searchengines.html" target="_self">Search Engines</a></li>
    <li><a href="outsidescholarships.html" target="_self">Outside Scholarships</a></li>
    <li><a href="generalinformation.html" target="_self">General Information</a></li>
    <li><a href="p2bcscholarship.html" target="_self">P2BC Scholarship</a></li>
          </ul>
        </li>
    </ul>
      <div id="home_body">
        <div id="home_news">
    <h2>"Finding a good college is hard. For you, it's even harder. Why? Because you're Catholic! We here at Proud2BCatholic.com want to help you find the Catholic college of your dreams so that you can more easily continue your journey as a Catholic student!"
    <br />
    <br />
    -The Proud2BCatholic Staff
    </h2>
        </div>
        <div id="home_video">
        <iframe width="440" height="277" src="http://www.youtube.com/embed/q5UDRgLGteg" frameborder="0" allowfullscreen></iframe>
        </div>
      </div>
      <div id="home_fblike">
        <div id="home_fblike_content">
        <iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FProud2BCa tholic&amp;width=292&colorscheme=light&show_faces=true&border_color&stream=true&header=tru e&height=235" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:260px; height:235px;" allowTransparency="false"></iframe>
        <br />
        <iframe id="fr" src="http://www.youtube.com/subscribe_widget?p=P2BCVideo" style="overflow: hidden; height: 95px; width: 260px; border: 0;" scrolling="no" frameBorder="0" allowTransparency="true"></iframe>
        </div>
      </div>
    </div>
      <div id="foot_contain">
        <div id="foot_content">
          <div align="center">FUS Admissions | 1235 University Blvd. | Steubenville, OH 43952 | <a href="mailto:[email protected]" title="email us!" target="_new">[email protected]</a> | ©2011 Proud2BCatholic</div>
        </div>
      </div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    </body>
    </html>
    Spry CSS:
    @charset "UTF-8";
    ul.MenuBarHorizontal
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size: 100%;
              cursor: default;
              width: auto;
              padding-left: 115px;
    ul.MenuBarActive
              z-index: 1000;
    ul.MenuBarHorizontal li
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size: 100%;
              position: relative;
              text-align: center;
              cursor: pointer;
              width: 110px;
              float: left;
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    ul.MenuBarHorizontal ul
              margin: 0;
              padding: 0;
              list-style-type: none;
              font-size: 100%;
              z-index: 1020;
              cursor: default;
              width: 110px;
              position: absolute;
              left: -1000em;
              font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
              left: auto;
    ul.MenuBarHorizontal ul li
              width: 110px;
    ul.MenuBarHorizontal ul ul
              position: absolute;
              margin: -5% 0 0 95%;
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
              left: auto;
              top: 0;
    ul.MenuBarHorizontal ul
              border: 0;
    ul.MenuBarHorizontal a
              display: block;
              cursor: pointer;
              background-color: #FFFFFF;
              padding: 0
    .em 0.75em;
              color: #1C4D00;
              text-decoration: none;
              padding-top: 5px;
              text-align: center;
              padding-bottom: 5px;
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
              background-color: #FFFFFF;
              color: #A39E42;
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
              background-color: #FFFFFF;
              color: #A39E42;
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
              background-image: url(SpryMenuBarDown.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
              background-image: url(SpryMenuBarRight.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
              background-image: url(SpryMenuBarDownHover.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
              background-image: url(SpryMenuBarRightHover.gif);
              background-repeat: no-repeat;
              background-position: 95% 50%;
    ul.MenuBarHorizontal iframe
              position: absolute;
              z-index: 1010;
              filter:alpha(opacity:0.1);
    @media screen, projection
              ul.MenuBarHorizontal li.MenuBarItemIE
              display: inline;
              f\loat: left;
              background: #FFF;

    John is quite correct, I have answered in the Spry Forum though I did not realise that it was a YouTube video that you were talking about. Goes to show that showing your code goes a long way to supplying a solution.
    For now, have a look at what Zabeth69 (where is she???) said about a year ago http://forums.adobe.com/message/2715476#2715476
    Gramps

  • Spry Drop Down Problem in Internet Explorer

    I have built my spry drop down and it is working in all browsers except for IE.  I really need help with this. Attached is my code or you can view it at roemtech.com/menubarattempt.html.  It is rendering it vertically and stacking the buttons on top of each other.  Check it out in Internet explorer to see what I mean. Thanks so much for the help.
    JBelsher
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>Template Model</title>
    <link href="webelements.css" rel="stylesheet" type="text/css" />
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <style type="text/css">
    .BulletAlignment { text-align: left;
    </style>
    </head>
    <body>
    <div class="container">
      <div class="header">
        <div align="right" class="FirstNameText"><strong><em>The First Name in Classroom Audio Systems</em></strong></div>
        <div style="background-color:#000; width:1024px; float: left;">
          <div>
    <ul id="DropDown" class="MenuBarHorizontal">
                        <li><a href="index.html">Home</a></li>
              <li><a href="Classroom-Audio-Systems.html" class="MenuBarItemSubmenu">Products</a>
                <ul>
                  <li><a href="classroom-audio-amplifiers.html">Amplifiers</a></li>
                  <li><a href="classroom-audio-speakers.html">Speakers</a></li>
                  <li><a href="classroom-audio-accessories.html">Accessories</a></li>
                </ul>
              </li>
              <li><a href="classroom-audio-specs.html">Specs</a> </li>
              <li><a href="classroom-audio-tips.html">Tech Tips</a></li>
              <li><a href="classroom-audio-contacts.html">Contacts</a></li>
            </ul>
          </div>
        </div>
        <div style="height:30px;"></div>
      </div>
    <!--End Header-->
    </div>
    <!--End of Content-->
      <div class="footer"><span style="padding-top:10px; font-size: 12px;">&copy; 2010 Roemtech LLC, All Rights Reserved 1491 N. Kealy Ave. Suite 8, Lewisville, Texas 75057</span></div>
    </div>
    <script type="text/javascript">
    var MenuBar1 = new Spry.Widget.MenuBar("DropDown", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
      </script>
    </body>
    </html>

    It needs to be versions 6 and higher of Internet Explorer.  I will attach my CSS below.  Just note all of the notes are still in there from dreamweaver.  Thanks for looking at this.
    James
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 120%;
    cursor: default;
    width: auto;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
    z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    position: relative;
    text-align: left;
    cursor: pointer;
    width: 120px;
    float: left;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
    margin: 0;
    padding: 0;
    list-style-type: none;
    font-size: 100%;
    cursor: default;
    width: 8.5em;
    position: absolute;
    left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
    left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
    width: 8.5em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
    position: absolute;
    margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
    left: auto;
    top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
    display: block;
    cursor: pointer;
    background-color: #000;
    padding: 0.5em 0.75em;
    color: #09F;
    text-decoration: none;
    text-align: center;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
    background-color: #000;
    color: #09F;
    font-size: 100%;
    text-align: center;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
    background-color: #333;
    color: #09F;
    text-align: center;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarDown.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
    background-image: url(SpryMenuBarRight.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarDownHover.gif);
    background-repeat: no-repeat;
    background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
    background-image: url(SpryMenuBarRightHover.gif);
    background-repeat: repeat-x;
    background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
    position: absolute;
    z-index: 1010;
    filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
    ul.MenuBarHorizontal li.MenuBarItemIE
    display: inline;
    f\loat: none;
    background: #FFF;

  • Spry Menu going wrong in Internet Explorer

    Hi all,
    I'm new to these forums, and new to web design. I added a horizontal spry menu in for my dads art website, it worked fine in Firefox 3.6 and Google Chrome, but Internet Explorer 7 or 8, I'm not sure which version, a recent one anyway. The menu goes completely wrong, they stay the color they are supposed to be, but the buttons all shift around and I'm not too sure what to do about this.
    www.studiovalentine.co.uk
    If people could take a look and leave me some suggestions, that would be great cheers.

    Add the following style rules, making sure that they are loaded after SpryMenuBarHorizontal.css as shown
    <link href="SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <style type="text/css">
    ul.MenuBarHorizontal {
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: auto;
    ul.MenuBarHorizontal li
        width: 16.6%;
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
        f\loat: left;
    </style>
    I hope this helps.
    Ben
    Sorry did not realise that it had already been answered
    Message was edited by: Ben Pleysier

  • Spry menu bar transparency in Internet Explorer 8

    Hello all, I've searched for this one but can't seem to find a solution that works. I'm using DW CS5 and I've included a spry menu bar and transparency on the site works great everywhere else except for the menu bar. I tried to use the hack to change the background to "transparent" but that did not work. Also, the site works fine in other browsers such as Firefox and Chrome but the spry menu bar is the only this that sticks out like a sore thumb in IE8. Please any help is appreciated and I thank you in advance.

    This is where the browser is told to supply a white background
    ul.MenuBarHorizontal a
         display: block;
         cursor: pointer;
         background-color: #fff;
         padding: 0.5em 0.75em;
         color: #333;
         text-decoration: none;
    Vhange the value to transparent.
    Also the last line int the CSS should be removed as in
    filter: "alpha(opacity=60)";
    Gramps

  • Spry horizontal menu goes wrong in Internet Explorer

    I have designed the start of a site and the client is pleased, except  that for some reason the Spry menu goes bananas in Internet Explorer 8.  I have checked it in Safari, Opera, Firefox and Chrome and it looks  fine. Earlier in the design process I was having some issues with a gap  at the end of the horizontal menu, but with persistance I managed to  cure this. According to DreamWeaver there is an issue with line 70 of  the CSS file :-
    #footer {
        font-family: Georgia, "Times New Roman", Times, serif;
        font-size: 16px;
        color: #FDCB00;
        background-color: #333;
        height: 30px;
        width: 900px;
        position: fixed;
        bottom: 0px;
        text-align: center;
        padding-top: 9px;
        letter-spacing: .3em;
        border-top-width: thin;
        border-top-style: ridge;
        border-top-color: #999;
    ....   but I can't see what is wrong with this. This relates to the footer  which ironically behaves fine. I have just upgrade IE8 to IE9, but this  hasn't helped.
    I am fairly desperate to finish this  site but can't until I find what is wrong. I've not seen this problem  before and the DW diagnosis isn't helping me.
    Here's a link http://www.tattoo-bristol.co.uk/
    Any pointers would be much appreciated.
    Thanks
    Ralph
    Vision Design

    Have a look at the following piece of code in your modified CSS file
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
        filter:alpha(opacity:0.1);
        background-color: #000;
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
        display: inline;
        f\loat: none;
        background-color: #F00;
    You have changed the latter two highlighted lines, which you must have done because you felt that you are an expert.
    Sorry to disappoint, because the last highlighted line is where the problem lies. If you replace the f/loat value back to the original left, your problem will have disappeared.
    Gramps

  • Java Applet Background Color Problem on Internet Explorer

    Hi,
    Please check out the following URL:
    http://www.utopiainteractive.com/clients/AkonFinal/glossary.htm
    The menu bar is writting in Java Applet. If you scroll down the page, and scroll back up, I see white background as I scroll back up. It happens only on Internet explorer. Neither Java Applet nor HTML Body bg color is white. I am kinda lost, and any help would really be appreciated.
    Thank you and look forward to hearing from someone soon.
    Sachin

    Hi,
    Well I used HtmlConver utility to generate applet html code, so I assume nothing is wrong with Object tag. Do you know what could cause this problem on Internet explorer? To be honest, I spent last couple of days, but I am just lost. It absolutely works fine on Netscape.
    Thanks,
    Sachin

  • Gui 7.0 windows xp, problem with Internet Explorer 6.0

    Hello Gurus,
       I am installing SAP GUI 7.00, on all the windows XP machines, of our SAP users. All the machines where GUI 7.00 is installed, are facing the problem with Internet Explorer. When we click on IE we don't get error but the requested URL do not show anything. Our version of Internet exploerer is 6.0.
      Gurus, need your help on this..
    Thanks and Regards,
    Rahul

    hi ,
      thanks for letting me know my error. I will raise this problem in the correct forum
    Thanks
    Rahul

  • Since the recent upgrade from Adobe pdf plug-inn Firefox often won't open pdf-files. Uninstalling doesn't help. I don't have this problem with Internet Explorer.

    Since the recent upgrade from Adobe pdf plug-inn Firefox often won't open pdf-files. Uninstalling doesn't help. I don't have this problem with Internet Explorer.

    Hi efacg,
    Most printing issues are solved by resetting the Printing preferences. When you print from Firefox and you click on the down arrow, do you see Defualt and Firefox? Please make changes to the preferences here and preview the document.
    If this continues to be an issue please also see [[Fix printing problems in Firefox]]
    If there are any other questions, please do not hesitate to ask, we are here to help.

  • Printer print size is very small. Do not have this problem with Internet explorer.

    When I try to print something in Firefox, the printer print size is extremely small. I do not have this problem with Internet Explorer.

    File > Page Setup - '''Scale''' <br />
    100% or Shrink to Fit is usually best.

  • Bonjours il n est pas possible de faire un paiement sur n importe quel site avec paypal sinon pas de probleme avec internet explorer

    bonjours il n est pas possible de faire un paiement sur n importe quel site avec paypal sinon pas de probleme avec internet explorer edit

    Hello didierj1, try to [https://support.mozilla.org/en-US/kb/Template:clearCookiesCache clear Cookies and Cache] and check it again.
    also be sure you have '''check mark''' in '''Accept cookies from sites'''[ v ] and to '''Accept third party cookies''' [ v ]
    see : [http://support.mozilla.org/en-US/kb/enable-and-disable-cookies-website-preferences#w_how-do-i-change-cookie-settings How do I change Cookie settings?]
    thank you

  • Spry Menu Bar Horizontal Problem in Internet Explorer

    I'm having a problem with a spry menu bar. It works fine in Firefox and Google Chrome, but in Internet Explorer the submenus shift to the right.
    And here's the code:
    @charset "UTF-8";/* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 *//* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. *//******************************************************************************* LAYOUT INFORMATION: describes box model, positioning, z-order *******************************************************************************//* The outermost container of the Menu Bar, an auto width box with no margin or padding */ul.MenuBarHorizontal{     margin: 0 auto;     padding: 0;     list-style-type: none;     font-size: 100%;     cursor: default;     width: 54em;     border-top-width: thick;     border-right-width: thick;     border-bottom-width: thick;     border-left-width: thick;     border-top-color: #00F;     border-right-color: #099;     border-bottom-color: #093;     border-left-color: #0F9;     top: auto;}/* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */ul.MenuBarActive{     z-index: 1000;}/* Menu item containers, position children relative to this container and are a fixed width */ul.MenuBarHorizontal li{     margin: 0;     padding: 0;     list-style-type: none;     font-size: 100%;     position: relative;     text-align: center;     cursor: pointer;     width: 18em;     float: left;     color: #F00;     background-color: #0000FF;}/* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */ul.MenuBarHorizontal ul{     margin: 0;     padding: 0;     list-style-type: none;     font-size: 100%;     z-index: 1020;     cursor: default;     width: 18em;     position: absolute;     left: -1000em;}/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */ul.MenuBarHorizontal ul.MenuBarSubmenuVisible{     left: auto;}/* Menu item containers are same fixed width as parent */ul.MenuBarHorizontal ul li{     width: 18em;}/* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */ul.MenuBarHorizontal ul ul{     position: absolute;     margin: -5% 0 0 95%;}/* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible{     left: auto;     top: 0;}/******************************************************************************* DESIGN INFORMATION: describes color scheme, borders, fonts *******************************************************************************//* Submenu containers have borders on all sides */ul.MenuBarHorizontal ul{     border: 1px solid #CCC;}/* Menu items are a light gray block with padding and no text decoration */ul.MenuBarHorizontal a{     display: block;     cursor: pointer;     background-color: #000;     padding: 0.5em 0.75em;     color: #C96;     text-decoration: none;     border: black;}/* Menu items that have mouse over or focus have a blue background and white text */ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus{     background-color: #900;     color: #009;     text-align: center;}/* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible{     background-color: #900;     color: #FFF;     text-decoration: underline;}/***************************************************************************** ** SUBMENU INDICATION: styles if there is a submenu under a given menu item *******************************************************************************//* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ul.MenuBarHorizontal a.MenuBarItemSubmenu{     background-image: url(SpryMenuBarDown.gif);     background-repeat: no-repeat;     background-position: 95% 50%;     text-align: center;     font-family: "Lucida Console", Monaco, monospace;     font-weight: bold;     color: #FF0;     border: 3px solid #039;}/* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */ul.MenuBarHorizontal ul a.MenuBarItemSubmenu{     background-image: url(SpryMenuBarRight.gif);     background-repeat: no-repeat;     background-position: 95% 50%;}/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ul.MenuBarHorizontal a.MenuBarItemSubmenuHover{     background-image: url(SpryMenuBarDownHover.gif);     background-repeat: no-repeat;     background-position: 95% 50%;}/* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover{     background-image: url(SpryMenuBarRightHover.gif);     background-repeat: no-repeat;     background-position: 95% 50%;}/******************************************************************************* BROWSER HACKS: the hacks below should not be changed unless you are an expert *******************************************************************************//* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */ul.MenuBarHorizontal iframe{     position: fixed;     z-index: 1010;     filter:alpha(opacity:0.1);}/* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */@media screen, projection{     ul.MenuBarHorizontal li.MenuBarItemIE     {          display: inline;          f\loat: left;               }}
    WHAT DO I DO? HELP ME, THANKS.
    Ummmmmmm HELLOO.
    SOMEONE HELP ME.
    ....boy you guys are reallllly helping

    Ohhhh noooo now it looks like this.
    I don't know what to do!!!!
    Here, let me give you the css code and the html code.
    <style type="text/css">
    <!--
    #apDiv1 {
        position:absolute;
        width:160px;
        height:126px;
        z-index:1;
        left: 205px;
        top: 424px;
        margin: 0 auto;
    -->
    </style>
    <style type="text/css">
    #apDiv3 {
        position:absolute;
        width:254px;
        height:206px;
        z-index:2;
        left: 123px;
        top: 1529px;
    #apDiv4 {
        position:absolute;
        width:250px;
        height:194px;
        z-index:3;
        left: 381px;
        top: 1528px;
    #apDiv5 {
        position:absolute;
        width:256px;
        height:200px;
        z-index:4;
        left: 636px;
        top: 1529px;
    #apDiv6 {
        position:absolute;
        width:349px;
        height:205px;
        z-index:5;
        left: 889px;
        top: 1530px;
    </style>
    <style type="text/css">
    #apDiv7 {
        position:absolute;
        width:887px;
        height:204px;
        z-index:6;
        left: 324px;
        top: 905px;
    #apDiv8 {
        position:absolute;
        width:1295px;
        height:74px;
        z-index:1;
        left: 212px;
        top: 668px;
    </style>
    <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>
    <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript">
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    </script>
    <style type="text/css">
    #apDiv2 {
        position:absolute;
        width:209px;
        height:197px;
        z-index:2;
        top: 1220px;
        left: 171px;
    #apDiv9 {
        position:absolute;
        width:331px;
        height:97px;
        z-index:3;
        left: 385px;
        top: 1218px;
    #apDiv10 {
        position:absolute;
        width:292px;
        height:199px;
        z-index:4;
        left: 724px;
        top: 1218px;
    #apDiv11 {
        position:absolute;
        width:200px;
        height:115px;
        z-index:1;
    body {
        background-color: #000;
        background-image: url();
        text-align: center;
        color: #F00;
    .none {
        font-size: 80px;
        font-family: "Times New Roman", Times, serif;
        font-weight: bold;
    #apDiv12 {
        position:absolute;
        width:991px;
        height:60px;
        z-index:5;
        left: 198px;
        top: 192px;
    #apDiv13 {
        position:absolute;
        width:200px;
        height:115px;
        z-index:1;
        left: 588px;
        top: 322px;
    </style>
    <body onLoad="MM_preloadImages('images/WebConfroll.png','images/youthfootballroll.png','images/ statefbsweatshirt.png')">
    <p align="center" class="none"><img src="images/footballtitle.png" width="941" height="183"></p>
    <ul id="MenuBar2" class="MenuBarHorizontal">
      <li><a class="MenuBarItemSubmenu" href="#">[Placeholder]</a>
        <ul>
          <li><a href="#">[Placeholder]</a></li>
          <li><a href="#">[Placeholder]</a></li>
          <li><a href="#">[Placeholder]</a></li>
        </ul>
      </li>
      <li><a href="#" class="MenuBarItemSubmenu">[Placeholder]</a>
        <ul>
          <li><a href="#">[Placeholder]</a></li>
          <li><a href="#">[Placeholder]</a></li>
          <li><a href="#">[Placeholder]</a></li>
        </ul>
      </li>
      <li><a class="MenuBarItemSubmenu" href="#">Videos</a>
        <ul>
          <li><a class="MenuBarItemSubmenu" href="#">2008 Videos</a>
            <ul>
              <li><a href="videos/2009 videos/Glenbard part one/partone.html">Glenbard South Game</a></li>
              <li><a href="#">&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&# 160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;&#160;[Placeholder]</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">2009 Videos</a>
            <ul>
              <li><a href="#">[Placeholder]</a></li>
              <li><a href="#">[Placeholder]</a></li>
            </ul>
          </li>
          <li><a href="#" class="MenuBarItemSubmenu">2010 Videos</a>
            <ul>
              <li><a href="#">[Placeholder]</a></li>
              <li><a href="#">[Placeholder]</a></li>
            </ul>
          </li>
        </ul>
      </li>
    </ul>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><span class="cent"><img src="images/bulldoghelmit.png" width="150" height="99" /></span></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p class="cent"> </p>
    <div align="center">
      <ul id="MenuBar1" class="MenuBarHorizontal">
        <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2008</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Defense%20Stats.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/2008%20Offense%20Stats.pdf">Offense and Records</a></li>
            <li><a href="http://page.bps101.net/web/t1350/BHS%20All%20Time%20Stats.pdf">AllTime Data</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football2009/Western%20Sun%202009.pdf">Western Sun Final Standings</a></li>
          </ul>
        </li>
        <li> <a href="#" class="MenuBarItemSubmenu">Football Season 2009</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/2009%20Banquet%20Record%20and%20Stats.pdf">Record Book and Offense</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202010/All-Time%20Data%202009.pdf">Alltime Data</a></li>
          </ul>
        </li>
        <li> <a class="MenuBarItemSubmenu" href="#">Football Season 2010</a>
          <ul>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2011%20Checklist.pdf">2010-2011 Offseason Checklist</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Defense%20Stats%20Final.pdf">Defense Stats</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20Stats%20Packet.pdf">Record Book and Offense</a></li>
            <li><a href="http://page.bps101.net/web/t1350/Football%202011/2010%20ALL%20TIME.pdf">Alltime Data</a></li>
          </ul>
        </li>
      </ul>
    </div>
    <p align="center"> </p>
    <p align="center"> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><img src="images/Batavia Youth football.png" alt="" width="869" height="200" /></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','images/WebConfroll.png',1)"></a></p>
    <div align="center">
      <div align="center"></div>
      <div align="center"><a href="http://www.athletics2000.com/upstate8/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image7','','images/WebConfroll.png',1)"><img src="images/WebConf.png" name="Image7" width="206" height="194" border="0" id="Image7" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/statefbsweatshirt.png',1)"><img src="images/statefbsweatshirt.jpg" name="Image6" width="375" height="199" border="0" id="Image6" /></a><a href="http://www.bataviayouthfootball.org/" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image8','','images/youthfootballroll.png',1)"><img src="images/youth football.png" name="Image8" width="329" height="197" border="0" id="Image8" /></a></div>
    </div>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/youthfootballroll.png',1)"></a></p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"> </p>
    <p align="center"><img src="images/Logos.png" width="1167" height="199" /></p>
    <script type="text/javascript">
    var MenuBar2 = new Spry.Widget.MenuBar("MenuBar2", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
    </script>
    @charset "UTF-8";
    /* SpryMenuBarHorizontal.css - version 0.6 - Spry Pre-Release 1.6.1 */
    /* Copyright (c) 2006. Adobe Systems Incorporated. All rights reserved. */
    LAYOUT INFORMATION: describes box model, positioning, z-order
    /* The outermost container of the Menu Bar, an auto width box with no margin or padding */
    ul.MenuBarHorizontal
        margin: auto 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        cursor: default;
        width: 54em;
        border-top: thick solid #00F;
        border-left: thick solid #00F;
        border-right: thick solid #00F;
        border-bottom: thick solid #00F;
        height: 2.2em;
    /* Set the active Menu Bar with this class, currently setting z-index to accomodate IE rendering bug: http://therealcrisp.xs4all.nl/meuk/IE-zindexbug.html */
    ul.MenuBarActive
        z-index: 1000;
    /* Menu item containers, position children relative to this container and are a fixed width */
    ul.MenuBarHorizontal li
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        position: relative;
        cursor: pointer;
        width: 18em;
        float: left;
    /* Submenus should appear below their parent (top: 0) with a higher z-index, but they are initially off the left side of the screen (-1000em) */
    ul.MenuBarHorizontal ul
        margin: 0;
        padding: 0;
        list-style-type: none;
        font-size: 100%;
        z-index: 1020;
        cursor: default;
        width: 18em;
        position: absolute;
        left: -1000em;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to auto so it comes onto the screen below its parent menu item */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible
        left: auto;
    /* Menu item containers are same fixed width as parent */
    ul.MenuBarHorizontal ul li
        width: 18em;
    /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */
    ul.MenuBarHorizontal ul ul
        position: absolute;
        margin: -5% 0 0 95%;
    /* Submenu that is showing with class designation MenuBarSubmenuVisible, we set left to 0 so it comes onto the screen */
    ul.MenuBarHorizontal ul.MenuBarSubmenuVisible ul.MenuBarSubmenuVisible
        left: auto;
        top: 0;
    DESIGN INFORMATION: describes color scheme, borders, fonts
    /* Submenu containers have borders on all sides */
    ul.MenuBarHorizontal ul
        border: 1px solid #CCC;
    /* Menu items are a light gray block with padding and no text decoration */
    ul.MenuBarHorizontal a
        display: block;
        cursor: pointer;
        background-color: #000;
        padding: 0.5em 0.75em;
        color: #C96;
        text-decoration: none;
        text-align: center;
        height: 1.2em;
    /* Menu items that have mouse over or focus have a blue background and white text */
    ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus
        background-color: #900;
        color: #009;
    /* Menu items that are open with submenus are set to MenuBarItemHover with a blue background and white text */
    ul.MenuBarHorizontal a.MenuBarItemHover, ul.MenuBarHorizontal a.MenuBarItemSubmenuHover, ul.MenuBarHorizontal a.MenuBarSubmenuVisible
        background-color: #900;
        color: #FFF;
        text-decoration: underline;
    SUBMENU INDICATION: styles if there is a submenu under a given menu item
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarDown.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
        color: #FF0;
        font-family: "Lucida Console", Monaco, monospace;
    /* Menu items that have a submenu have the class designation MenuBarItemSubmenu and are set to use a background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenu
        background-image: url(SpryMenuBarRight.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarDownHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    /* Menu items that are open with submenus have the class designation MenuBarItemSubmenuHover and are set to use a "hover" background image positioned on the far left (95%) and centered vertically (50%) */
    ul.MenuBarHorizontal ul a.MenuBarItemSubmenuHover
        background-image: url(SpryMenuBarRightHover.gif);
        background-repeat: no-repeat;
        background-position: 95% 50%;
    BROWSER HACKS: the hacks below should not be changed unless you are an expert
    /* HACK FOR IE: to make sure the sub menus show above form controls, we underlay each submenu with an iframe */
    ul.MenuBarHorizontal iframe
        position: absolute;
        z-index: 1010;
        filter:alpha(opacity:0.1);
    /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */
    @media screen, projection
        ul.MenuBarHorizontal li.MenuBarItemIE
            display: inline;
            f\loat: left;
            background: #FFF;
    DON'T GIVE UP ON ME. PLEASE.

  • Spry menu problems with Internet explorer

    Hi everyone
    I'm having ongoing problems with my horizontal menus and
    internet explorer. They work fine in other browsers and with the
    generous help of others at these forums I've managed to sort out
    most of the problems. But I've hit a real wall with this one. The
    menus drop down showing the links OK but you cannot highlight or
    click on the options that drop down, they just appear as text. Any
    help would be appretiated. My appologies for posting in other
    threads also but just hoping for a response.
    I am very new to this side of design so simple answers would
    be very helpful. Thanks
    Bob

    I have 2 similar problems to the prior posts:
    1) I run IE7 and FF and the positioning of my submenus are
    skewed in IE only.
    2) I am not sure, but I believe I have a problem with my
    iframe appearing in my IE7 browser behind all of my submenus. Well,
    I know I have a problem with something, but whether or not it's the
    iframe I don't know. What I do know is that the box shows up like a
    border around my submenus and I can't get rid of it. I suspect that
    it may be caused by the fact that my menu buttons are imported
    gif's in the shape of rounded rectangles which allows for the
    corners to be visible. I actually just thought about it and my
    gif's are set to have a white index transparency, but maybe If I
    export the gifs without transparency, then that issue will be
    resolved. Well I will try that part and see, but any and all
    suggestions are welcome. Oh and I just remembered, that problem
    with the border around my submenus also has another problem with
    the word "false" inside of that border behind my submenus. This
    problem again is only in my IE browser, and it is hard to see it,
    but I have no idea why that is there or what it's from. I ran a
    search in my SpryMenuHorizontal.css page and in my html page for
    the word 'false' but nothing turned up. The only document related
    to this issue that contains the word 'false' is the
    'SpryMenuBar.js' document.
    CSS
    Layout file
    HTML Demo
    link
    Thank you,
    Danny

  • Menu positioning problem when viewing in Internet explorer on a pc

    Hi guys,
    I have created a website for a football team and I am having problems with the menu. It looks fine in all browsers apart from Internet Explorer. The menu positioning is meant to be on the left hand side but shows far right on the screen when viewed in Internet Explorer. Does anyone know how I can resolve this issue?
    http://www.stormersfc.co.uk
    css sheet - http://www.stormersfc.co.uk/style.css
    Hopefully someone can help.
    Cheers,
    Roy

    Hummm....its difficult to tell. Youre using so many redundant css styles ie not needed.
    Youre 'leftPan' <div> container is 140px in width but your ul (unordered list inside it is 244px wide?
    Why set widths and heights when they are not needed. You have no idea what height the ul and li will be in other users browsers. A child element placed inside a parent container will stretch to the full width without specifying a width for the child element. The key to web deisgn is keeping all the maths 100% correct. If you so much as get anything out by even one px it could break the design.
    #leftPan{
         margin-left: 90px;
         width: 140px;
    #leftPan ul{
         width:244px;
         height:250px;
         background-position: 0 0;
         padding-top: 0px;
         padding-right: 0;
         padding-bottom: 0;
         padding-left: 0;
         margin-top: 1px;
         text-decoration: none;
    I see no reason why your based structure ie the 'container', 'header', 'mainpic', sidebar1 and 'mainContent' should not work in all browsers. Now what you have inside those may be casuing the conflict. I would strip the page back to the base structure (check that it does work in all browsers) then begin to fill the containers, checking as you go.

Maybe you are looking for