Interesting problem in IE7.....yeah I know!

HTML & CSS
1

My client informed me that he noticed a problem with a certain page that contains a simple table. The first row is over to the left compared to the other rows. I tested in IE7, IE8, and IE9. IE7 is the only problem that I am noticing. All other browsers are fine. I chose to do this as a table because it was quick and easy. What could the problem be?

    <table width="900" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>
        <td width="300" align="center" valign="top"><p>Elite Sports<br />
            136 Wilcox Street <br />
            Castle Rock, CO 80104<br />
            (303)814-9700<br />
            TJ Schenbeck</p></td>
        <td width="300" align="center" valign="top"><iframe width="200" height="200" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&amp;source=s_q&amp;hl=en&amp;geocode=&amp;q=136+Wilcox+Street+Castle+Rock,+CO+80104+&amp;aq=&amp;sll=38.904818,-104.776998&amp;sspn=0.008533,0.013486&amp;vpsrc=0&amp;ie=UTF8&amp;hq=&amp;hnear=136+Wilcox+St,+Castle+Rock,+Colorado+80104&amp;t=h&amp;ll=39.370867,-104.860039&amp;spn=0.013138,0.016994&amp;z=14&amp;iwloc=A&amp;output=embed"></iframe>
          <br />
          <p><small><a href="http://maps.google.com/maps?f=q&amp;source=embed&amp;hl=en&amp;geocode=&amp;q=136+Wilcox+Street+Castle+Rock,+CO+80104+&amp;aq=&amp;sll=38.904818,-104.776998&amp;sspn=0.008533,0.013486&amp;vpsrc=0&amp;ie=UTF8&amp;hq=&amp;hnear=136+Wilcox+St,+Castle+Rock,+Colorado+80104&amp;t=h&amp;ll=39.370867,-104.860039&amp;spn=0.013138,0.016994&amp;z=14&amp;iwloc=A" style="color:#0000FF;text-align:left">View Larger Map</a></small></p>
          <p>&nbsp;</p></td>
      </tr>
2

Your table width is 900 pixels wide while your TD elements are 300 pixels wide which would cause the browser to generate a width based on the content inside the TD, to avoid this issue give the TD elements a width of 50% which will evenly space them consistently across all browsers.

3

Thank you so much! Than fixed it! It has been a long time since I used a table in a design. I know that it is probably best practice to use CSS for the table but I admit I got lazy. I will look into fixing this in the future with this particular table so I have a better understanding of the use of CSS with tables.

4

Your welcome :slight_smile: