background image not showing correctly in IE7

Posted on 2007-10-10
Last Modified: 2010-05-18
I've been developing an intranet for IE6 users and all has gone well.
I have just checked it out using IE7 and there is a very strange behaviour.

This is how the image looks in IE6 (resized for speed)
and this is how it displays in IE7
The top image (top half of fish head) is a standard <img>
The bottom half that does not show properly in IE7 is a TD background.

Here is the relevant code from the page

 <table width="955"  border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
    <td colspan="2" style="height: 83px; width:955"><img alt="WANDA" border="0" src="images/WandaTop2.jpg" width="955" height="83" runat="server" usemap="#isMap" /></td>

    <td style="width: 258px; height: 520px; background-image:url(/wanda/images/WandaSide.jpg); background-position: left top; background-attachment: fixed; background-repeat: no-repeat;" valign="top">
        <div style="z-index: 101; left: 8px; width: 176px; position: relative; top: 32px;">
            <br />
            <br />
       <span style="font-family:Gill Sans MT; color:White">Intranet Essentials</span><br />
       <a class="linklist" href="absentees.aspx" runat="server">Absentees</a><br />
       <a class="linklist" href="http://wdc-dvmain/Intranet/forum/login.asp?target=default.asp" runat="server">The Lounge</a><br />
       <a class="linklist" href="Tatou hui/TatouHui.doc" runat="server">Tatou Hui</a><br />
       <a class="linklist" href="socialClub/default.aspx" runat="server">Social Club</a><br />
       <span style="font-family:Gill Sans MT; color:White">External Links</span><br />
       <a class="linklist" href="" target="_blank">Gallery</a><br />
       <a class="linklist" href="" target="_blank">Museum</a><br />
        <a class="linklist" href="" target="_blank">Library</a><br />
        <a class="linklist" href="" target="_blank"> LGNZ</a><br />
        <a class="linklist" href="" target="_blank">Opera House</a><br />
        <a class="linklist" href="" target="_blank">WINC</a><br />
        <span style="font-family:Gill Sans MT; color:White">Interactive</span><br />
         <a class="linklist" href="http://wdc-16/wdc_live/">My Payslips</a><br />
         <a class="linklist" href="#">IT Help Desk</a><br />
         <a class="linklist" href="Talk2Wanda.aspx" runat="server">Talk to Wanda</a><br />
         <a class="linklist" href="search.aspx" runat="server">Search</a><br />
    <img alt="" src="images/spacer.gif" width="258" height="5"  runat="server" /><br />
    <td align="left" valign="top" style="width: 689px;">
    <img src="images/wandawords.gif"  runat="server" alt="WDC Announcements" />
   <table width="685px">
  <td valign="top" style="width: 700px">
        <asp:contentplaceholder id="ContentPlaceHolder1" runat="server">


Question by:QPR
    LVL 30

    Expert Comment

    in the td holding the image, you're missing a 'px'

    you have <td colspan="2" style="height: 83px; width:955">

    but it should be <td colspan="2" style="height: 83px; width:955px">
    LVL 29

    Author Comment

    well spotted, made no difference tho :(
    LVL 5

    Expert Comment

    the relevant code would include your stylesheet. please provide :-)
    LVL 29

    Author Comment

    The relevant bit was this....

    IE6 resolved the path no problem but for some reason IE7 couldn't! (have sinced tested or 4 different IE7 boxes) if I changed it to
    it works perfectly. Weird as the folder structure is same as it's always been
    LVL 5

    Expert Comment

    you could try either, or both, z-indices and clearing
    LVL 29

    Accepted Solution

    Solved. I took out this bit... background-attachment: fixed and now it displays perfectly
    LVL 1

    Expert Comment

    Closed, 500 points refunded.
    Community Support Moderator

    Featured Post

    Better Security Awareness With Threat Intelligence

    See how one of the leading financial services organizations uses Recorded Future as part of a holistic threat intelligence program to promote security awareness and proactively and efficiently identify threats.

    Join & Write a Comment

    This is a how to build your own CSS3 slideshow and when I say CSS3 I mean just CSS with no javascript in sight! There a few examples online of how to do this but most just show you an example without any explanation, others make it more complicat…
    Browsers only know CSS so your awesome SASS code needs to be translated into normal CSS. Here I'll try to explain what you should aim for in order to take full advantage of SASS.
    The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
    The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

    732 members asked questions and received personalized solutions in the past 7 days.

    Join the community of 500,000 technology professionals and ask your questions.

    Join & Ask a Question

    Need Help in Real-Time?

    Connect with top rated Experts

    20 Experts available now in Live!

    Get 1:1 Help Now