3 Replies Latest reply on May 9, 2010 7:02 PM by homebrews

    IE making life difficult

    homebrews Level 1

      The IE family seems to have minds of their own. And I would like to gain some knowledge on how to fix.

       

      This page http://classreunionprogram.com/contact.htm has a space above the form and the header in IE6, IE7 and IE8. The space was much greater in IE6 until I inserted these lines:

       

      /* place css fixes for all versions of IE in this conditional comment */
      #navbar { padding-top: 30px; }
      #content { zoom: 1; padding-top: 15px; }
      /* the above proprietary zoom property gives IE the hasLayout it needs to avoid several bugs */

       

      What needs to be added to remove the space as the form should abut the header. As in Firefox and Safari. The space is also present in the navbar.

        • 1. Re: IE making life difficult
          homebrews Level 1

          Changed the navbar and content padding-top: 0; and voila! all is ok in oz. However, IE7 changes the background color and shortens the vbg.gif in the navbar. That is a puzzle. Thanks for the help.

          • 2. Re: IE making life difficult
            Ben M Adobe Community Professional

            Right now I see 2 errors in your code which could eventually make problems.  First is the id "footer" is used twice on the page, once for a list and once for a div.  Second, you are missing a ";" at the end of line 138 in your SpryMenuBar CSS document.

             

            With regards to developing a site for older versions of IE (most notably 6), if most of your users don't use I wouldn't try to program for it.  The divs can be made to work much easier with 7+ than with 6 which had almost no support for them whatsoever.  If you have to make changes for 6, remove them, test in 7, 8, and Firefox and if those three work fine, use that as your starting point and try to make 6 work from there.

            • 3. Re: IE making life difficult
              homebrews Level 1

              Thank you. Corrected the duplication with "footer" id. However, this is what I see in the spry css:

               

              ul.MenuBarVertical iframe
              {
                  position: absolute;
                  z-index: 1010;
                  filter:alpha(opacity:0.1); /* this is line 138 */
              }

               

              Could you expand on the missing ';'

               

              Concerning IE6. Thanks for you thoughts. Was thinking along the same lines but have no idea the usage of ie6. apparently it is not worth the worry.

               

              Still having troubles with IE7.

               

              Thank you.