SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Thread: Page Line up

  1. #1
    SitePoint Member
    Join Date
    Sep 2013
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Page Line up

    For some reason out of the blue, I updated a site and now the images for the background of the page will not line up in IE. The site looks fine in Chrome however. I can't seem to see the issue. Any advice? www.soupthyme.com

    Code:
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <title>Soup Thyme</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></meta>
    <style type="text/css">
    <!--
    body {
    	background-color: #8b1515;
    	color: #8B1515;
    }
    .style4 {
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #FFFFFF;
    }
    .style21 {
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	font-size: 10px;
    	color: #000;
    }
    .style18 {
    	font-family: Geneva, Arial, Helvetica, sans-serif;
    	font-size: 14px;
    	font-weight: bold;
    	color: #FFFFFF;
    }
    .style19 {
    	color: #000000
    }
    .style23 {
    	font-family: Geneva, Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #FFFFFF;
    }
    .style15 {
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	font-size: 12px;
    	color: #000;
    	text-align: center;
    }
    .style20 {
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    	font-size: 16px;
    	font-weight: bold;
    	color: #000;
    }
    .style11 {
    	font-size: 11px;
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    }
    .style24 {
    	font-size: 2px
    }
    .style25 {
    	font-size: 16px;
    	font-weight: bold;
    	color: #000;
    	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    }
    .style26 {
    	font-family: Geneva, Arial, Helvetica, sans-serif;
    	font-size: 11px;
    }
    -->
    </style>
    </head>
    <body>
    <div align="center">
      <table id="Table_01" width="776" border="0" cellpadding="0" cellspacing="0">
        <tr>
          <td colspan="17"><img src="images/index_01.gif" width="775" height="190" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="190" alt=""></td>
        </tr>
        <tr>
          <td colspan="3" rowspan="3"><img src="images/index_02.gif" width="114" height="83" alt=""></td>
          <td width="193" height="75" colspan="4" class="images/index_03.gif"><div align="center"><span class="style4">450 Monroe Tpke.<br>
              Monroe, CT 06468<br>
              <strong>P: (203).268.0214</strong><br>
              F: (203).268.1073</span></div></td>
          <td colspan="10" rowspan="2"><img src="images/index_04.gif" width="468" height="82" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="75" alt=""></td>
        </tr>
        <tr>
          <td colspan="4" rowspan="2"><img src="images/index_05.gif" width="193" height="8" alt=""></td>
          <td height="7"><img src="images/spacer.gif" width="1" height="7" alt=""></td>
        </tr>
        <tr>
          <td rowspan="14"><img src="images/index_06.gif" width="34" height="578" alt=""></td>
          <td colspan="2" rowspan="2"><a href="menu.pdf" target="_blank"><img src="images/index_07.gif" alt="" width="75" height="39" border="0"></a></td>
          <td colspan="7"><img src="images/index_08.gif" width="359" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="1" alt=""></td>
        </tr>
        <tr>
          <td rowspan="13"><img src="images/index_09.gif" width="48" height="578" alt=""></td>
          <td colspan="4"><a href="index.html"><img src="images/index_10.gif" alt="" width="109" height="38" border="0"></a></td>
          <td rowspan="2"><img src="images/index_11.gif" width="40" height="39" alt=""></td>
          <td><img src="images/index_12.gif" width="110" height="38" alt=""></td>
          <td colspan="2" rowspan="4"><img src="images/index_13.gif" width="56" height="122" alt=""></td>
          <td><img src="images/index_14.gif" width="105" height="38" alt=""></td>
          <td rowspan="4"><img src="images/index_15.gif" width="43" height="122" alt=""></td>
          <td colspan="2"><a href="contact.html"><img src="images/index_16.gif" alt="" width="101" height="38" border="0"></a></td>
          <td rowspan="13"><img src="images/index_17.gif" width="54" height="577" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="38" alt=""></td>
        </tr>
        <tr>
          <td colspan="4"><img src="images/index_18.gif" width="109" height="1" alt=""></td>
          <td><img src="images/index_19.gif" width="110" height="1" alt=""></td>
          <td colspan="2" rowspan="9"><img src="images/index_20.gif" alt="" width="75" height="350" border="0"></td>
          <td rowspan="3"><img src="images/index_21.gif" width="105" height="84" alt=""></td>
          <td colspan="2" rowspan="3"><img src="images/index_22.gif" width="101" height="84" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="1" alt=""></td>
        </tr>
        <tr>
          <td width="259" height="38" colspan="6" background="images/index_23.gif"><span class="style18">Last Updated: <span class="style19">09/03/2013 @ 6:00am</span></span></td>
          <td><img src="images/spacer.gif" width="1" height="38" alt=""></td>
        </tr>
        <tr>
          <td colspan="6"><img src="images/index_24.gif" width="259" height="45" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="45" alt=""></td>
        </tr>
        <tr>
          <td colspan="3" rowspan="2"><img src="images/index_25.gif" width="91" height="116" alt=""></td>
          <td width="168" height="78" colspan="3" valign="top" background="images/index_26.gif"><span class="style21"> Tabbouleh <br>
            Greek Salad<br>
            Cranberry Apple Tuna Salad<br>
            Rainbow Salad</span></td>
          <td rowspan="6"><img src="images/index_27.gif" width="36" height="266" alt=""></td>
          <td width="262" height="121" colspan="4" rowspan="3" valign="top" background="images/index_28.gif"><span class="style15">Ronald Lee has worked as a professional chef for decades. In 2005 he established Soup Thyme, to share his passion for food,&nbsp;made from&nbsp;the finest quality ingredients. Since then, it has become a center-point eatery known to all in the town of Monroe.</span></td>
          <td rowspan="9"><img src="images/index_29.gif" width="7" height="455" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="78" alt=""></td>
        </tr>
        <tr>
          <td colspan="3"><img src="images/index_30.gif" width="168" height="38" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="38" alt=""></td>
        </tr>
        <tr>
          <td rowspan="7"><img src="images/index_31.gif" width="12" height="339" alt=""></td>
          <td width="247" height="241" colspan="5" rowspan="5" valign="top" background="images/index_32.gif"><p class="style14 style11 style23">          Chicken Pot Pie<br>
              Roasted Butternut Squash...................V,GF<br>
              Chicken Spinach Gorgonzola<br>
              Vegetable Beef Barley<br>
              Chicken Noodle <br>
              Broccoli &amp; Cheddar...........................V<br>
              Chicken &amp; Rice...............................GF<br>
              Kale &amp; Bean.........................V,GF<br>
              Chicken Artichoke &amp; Sun Dried Tomatoes<br>
              Chili............................................GF<br>
              Beef Stroganoff.................................GF<br>
              Macaroni &amp; Cheese...........................V<br>
              Tuscan Pork........................................GF</td>
        </tr>
        <tr>
          <td colspan="4"><img src="images/index_33.gif" width="262" height="45" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="45" alt=""></td>
        </tr>
        <tr>
          <td width="262" height="60" colspan="4" background="images/index_34.gif"><div align="center"><span class="style20">1/2 Panini &amp; Small Soup - $6.75</span></div></td>
          <td><img src="images/spacer.gif" width="1" height="60" alt=""></td>
        </tr>
        <tr>
          <td colspan="4"><img src="images/index_35.gif" width="262" height="40" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="40" alt=""></td>
        </tr>
        <tr>
          <td rowspan="3"><img src="images/index_36.gif" width="30" height="189" alt=""></td>
          <td width="343" height="146" colspan="6" rowspan="2" align="center" valign="middle" background="images/index_37.gif"><table width="337" border="0">
              <tr>
                <td><div align="center" class="style25">
                    <p>Thyme Frame- $5.75 </p>
                    <p>Chicken Breast, Ham, Swiss, Honey Mustard</p>
                  </div></td>
              </tr>
              <tr>
                <td height="21">&nbsp;</td>
              </tr>
            </table>
            <a href="https://twitter.com/SoupThyme" target="_blank"><img src="images/twitter.gif" alt="" width="30" height="30" border="0"></a><a href="http://instagram.com/soupthyme" target="_blank"><img src="images/instagram.gif" alt="" width="30" height="30" border="0"></a></td>
          <td><img src="images/spacer.gif" width="1" height="91" alt=""></td>
        </tr>
        <tr>
          <td colspan="5" rowspan="2"><img src="images/index_38.gif" alt="" width="247" height="98" border="0" usemap="#Map"></td>
          <td><img src="images/spacer.gif" width="1" height="55" alt=""></td>
        </tr>
        <tr>
          <td colspan="6"><img src="images/index_39.gif" width="343" height="43" alt=""></td>
          <td><img src="images/spacer.gif" width="1" height="43" alt=""></td>
        </tr>
        <tr>
          <td><img src="images/spacer.gif" width="48" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="12" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="54" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="25" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="18" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="40" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="110" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="34" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="30" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="45" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="36" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="20" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="105" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="43" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="94" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="7" height="1" alt=""></td>
          <td><img src="images/spacer.gif" width="54" height="1" alt=""></td>
          <td></td>
        </tr>
      </table>
    </div>
    <map name="Map">
      <area shape="rect" coords="62,27,184,55" href="https://www.facebook.com/pages/Soup-Thyme/192964647825" target="_blank" alt="Facebook"></area>
    </map>
    </body>
    </html>

  2. #2
    It's all Geek to me silver trophybronze trophy
    ralph.m's Avatar
    Join Date
    Mar 2009
    Location
    Melbourne, AU
    Posts
    24,219
    Mentioned
    457 Post(s)
    Tagged
    8 Thread(s)
    Hi jmalia. Welcome to the forums.

    It's been a while since we've seen a site using tables for layout. This is a really out of date way to lay out a page, and introduces problems you don't need. Anyhow, I'm not much good at debugging table layouts, but the one thing I'd suggest is that you add a doctype declaration at the top of the page, as otherwise browsers will drop into "quirks mode".

    E.g. put this at the top of your code:

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •