8 Replies Latest reply on Jan 25, 2012 3:08 PM by pofo401k

    Footer problem...IE (Internet Explorer)

    pofo401k

      Ok in older internet explorer and fire fox the footer for some reason kick lower then where it should be and i dont know why. http://douglaspaquette.mivamerchant.net/website/douglaspaquette.html.. this is the page.

       

      why one know why?

       

      css:

       

      /* 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

      {

                list-style-type: none;

                font-size: 105%;

                cursor: default;

                width: auto;

                margin-top: -32px;

                margin-right: 0%;

                margin-bottom: 0px;

                margin-left: 5em;

                height: auto;

                float: left;

                border-bottom-style: none;

                font-weight: normal;

                line-height: normal;

                font-style: normal;

                color: #000;

                padding-top: 0px;

                padding-right: 0%;

                padding-bottom: 0px;

                padding-left: 0%;

                text-align: center;

                border-top-style: none;

                border-right-style: none;

                border-left-style: none;

      }

      /* 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

      {

                padding: 0;

                list-style-type: none;

                font-size: 100%;

                position: relative;

                text-align: center;

                cursor: pointer;

                width: auto;

                float: left;

                margin-top: 10px;

                margin-right: 0;

                margin-bottom: 0;

                margin-left: 0;

                visibility: inherit;

      }

      /* 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: 110%;

                z-index: 1020;

                cursor: default;

                width: 12em;

                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;

                -khtml-opacity: 0.9;

                background-color: #666;

      }

      /* Menu item containers are same fixed width as parent */

      ul.MenuBarHorizontal ul li

      {

                width: 11em;

      }

      /* Submenus should appear slightly overlapping to the right (95%) and up (-5%) */

      ul.MenuBarHorizontal ul ul

      {

                position: absolute;

                margin-right: 0;

                margin-bottom: 0;

                width: 12em;

                margin-left: 12em;

      }

      /* 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;

                background-color: #666;

      }

       

       

      /*******************************************************************************

       

       

      DESIGN INFORMATION: describes color scheme, borders, fonts

       

       

      *******************************************************************************/

       

       

      /* Submenu containers have borders on all sides */

      ul.MenuBarHorizontal ul

      {

                border: 1.5px solid #fff;

                font-size: 12px;

                padding-top: 0px;

      }

      /* Menu items are a light gray block with padding and no text decoration */

      ul.MenuBarHorizontal a

      {

                display: block;

                cursor: auto;

                background-color: opacity

      :0.4;

                color: #FFFFFF;

                text-decoration: none;

                font-size: 100%;

                padding-top: 0em;

                padding-right: 2em;

                padding-bottom: 0em;

                padding-left: 0em;

      }

      /* Menu items that have mouse over or focus have a blue background and white text */

      ul.MenuBarHorizontal a:hover, ul.MenuBarHorizontal a:focus

      {

                color: #F69;

                background-color: transparent;

      }

      /* 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: transparent;

                color: #FF6699;

      }

       

       

      /*******************************************************************************

       

       

      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: 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;

      }

      /* HACK FOR IE: to stabilize appearance of menu items; the slash in float is to keep IE 5.0 from parsing */ 

      ul.MenuBarHorizontal li.MenuBarItemIE

      {

                display: inline;

                f\loat: left;

                background-color: #FFF;

                filter:alpha(opacity=0);

                /* [disabled]-moz-opacity:0.; */

                -khtml-opacity: 0.;

                opacity: 0.;

      }

       

       

      html:

       

      <!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>Douglas Paquette</title>

      <style type="text/css">

      <!--

      body {

                margin: 0;

                padding: 0;

                color: #000;

                font-family: Verdana, Arial, Helvetica, sans-serif;

                font-size: 100%;

                line-height: 1.4;

                background-color: #42413C;

                background-position: center;

                left: auto;

                right: auto;

      }

       

       

      /* ~~ this fixed width container surrounds the other divs ~~ */

      .container {

                width: 1260px; /* the auto value on the sides, coupled with the width, centers the layout */

                background-attachment: scroll;

                background-color: transparent;

                background-repeat: no-repeat;

                background-position: bottom;

                height: 640px;

                margin-top: 150;

                margin-right: auto;

                margin-bottom: auto;

                margin-left: auto;

                clip: rect(auto,auto,auto,auto);

                background-image: url(Homepage%20Layout%20/Web_BackGround1.gif);

      }

       

       

      /* ~~ the header is not given a width. It will extend the full width of your layout. It contains an image placeholder that should be replaced with your own linked logo ~~ */

      .header {

                background-color: transparent;

                background-image: url(Homepage%20Layout%20/Banner.jpg);

                height: 150px;

                /* [disabled]background-attachment: scroll; */

                background-repeat: no-repeat;

                background-position: center bottom;

                width: 1260px;

      }

       

       

      /* ~~ The footer ~~ */

      .footer {

                background-color: transparent;

       

       

      -->

      ;                                                                                                                                                                                                                                                                                                                                                                                                                     width: 1260px;

                clip: rect(auto,auto,auto,auto);

                float: inherit;

                margin-top: 491px;

                height: 200px;

      </style>

      <script src="SpryAssets/SpryMenuBar.js" type="text/javascript"></script>

      <link href="SpryAssets/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />

      <style type="text/css">

      #apDiv1 {

                position:absolute;

                left:30px;

                top:213px;

                width:123px;

                height:361px;

                z-index:1;

      }

      #apDiv2 {

                position:absolute;

                left:965px;

                top:31px;

                width:453px;

                height:79px;

                z-index:1;

      }

      </style>

      </head>

       

       

      <body>

      <div class="container">

        <div class="header" id="logo">

            <div class="header"><!-- end .header -->      </div>

        </div>

          <ul id="MenuBar1" class="MenuBarHorizontal">

      <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WA" class="MenuBarItemSubmenu">WOMEN'S ACCESSORIES</a>

            <ul>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_JEWELRY" class="MenuBarItemSubmenu">JEWELRY</a>

                  <ul>

                    <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_JEWELRY">BRACELETS</a></li>

                    <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_RINGS">RINGS</a></li>

                    <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_SEMI-PRECIOUS">SEMI-PRECIOUS</a></li>

                  </ul>

                </li>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_SANDALS">SANDALS</a></li>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_WATCHES">WATCHES</a></li>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_KEYCHAINS">KEY CHAINS</a></li>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_HEADBANDS" class="MenuBarItemSubmenu">HEAD BANDS</a>

                  <ul>

                    <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_RIBBON">RIBBON</a></li>

                    <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_HB1">MINI PAPPAGALLO</a></li>

                  </ul>

                </li>

              </ul>

            </li>

            <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=PA" class="MenuBarItemSubmenu">PET ACCESSORIES</a>

              <ul>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=PASTYLES_Ribbon">RIBBON</a></li>

                <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=PASTYLES_Reflictive">REFLECTIVE</a></li>

              </ul>

            </li>

            <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=abus">ABOUT US</a></li>

            <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=LOGN">ACCOUNT</a></li>

            <li><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=SRCH">SEARCH</a></li>

          </ul>

          <div class="footer">

            <table border="2" align="center" cellpadding="3" cellspacing="0" class="footer">

              <tr>

                <th bgcolor="#42413C" scope="col"><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=PA"><img src="Homepage Layout /QuickLinks/(home)QuickLink_Collars.jpg" width="300" height="214" alt="pet" /></a></th>

                <th bgcolor="#42413C" scope="col"><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_SANDALS"><img src="Homepage Layout /QuickLinks/(home)QuickLink_Womens.jpg" width="300" height="215" alt="sandals" /></a></th>

                <th bgcolor="#42413C" scope="col"><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_WATCHES"><img src="Homepage Layout /QuickLinks/(home)QuickLink_Watches.jpg" width="300" height="215" alt="watches" /></a></th>

                <th bgcolor="#42413C" scope="col"><a href="http://douglaspaquette.mivamerchant.net/mm5/merchant.mvc?Store_Code=DPI&Screen=CTGY&Catego ry_Code=WASTYLES_JEWELRY"><img src="Homepage Layout /QuickLinks/QuickLink_Jewlery.jpg" width="300" height="214" alt="jewelry" /></a></th>

              </tr>

            </table>

            <div align="center"></div>

          </div>

      <!-- end .container --></div>

      </div>

      <script type="text/javascript">

      var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"SpryAssets/SpryMenuBarDownHover.gif", imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});

      </script>

      </body>

      </html>