#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2004
    Posts
    170
    Rep Power
    55

    Question Text not lineing up in IE6 but fine in Firefox?


    Hello.

    The address text on the following page doesn't line up. The address/phone/fax for each location should be side by side.

    Firefox 3 works fine. IE6 the "Westwood Location" text moves down below.

    What am I missing?'

    http://nessphysiotherapy.com/contact.php

    Thanks
  2. #2
  3. Classical Computing
    Devshed Novice (500 - 999 posts)

    Join Date
    May 2008
    Location
    Melbourne, Australia
    Posts
    891
    Rep Power
    106
    Your ContactInner div is having a bad time of it in IE6. It doesn't know whare it's supposed to be.

    Perhaps help it out by giving it a width of 495px (or maybe a bit more). See if that helps.

    As an aside, rather than use that clearing div at the bottom of ContactInner, use overflow: hidden in the css instead:

    Code:
    #ContactInner {
        width: 495px;
        overflow: hidden;
    }
    Simple is beautiful.
  4. #3
  5. Thanks Johnny Hart (BC) R.I.P.

    Join Date
    May 2003
    Location
    Dallas
    Posts
    5,262
    Rep Power
    1960
    Is there some reason you didn't mark the data as a table? It is positionally related, or tabular, data. That's a table. Using appropriate semantic and structural markup will make things more straight forward.
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    
    <html xml:lang="en"
          xmlns="http://www.w3.org/1999/xhtml"
          lang="en">
    <head>
      <meta name="generator"
            content=
            "HTML Tidy for Linux (vers 6 November 2007), see www.w3.org" />
    
      <title>Test</title>
      <meta http-equiv="content-type"
            content="text/html; charset=utf-8" />
      <meta name="author"
            content="Gary Turner" />
      <style type="text/css">
    /*<![CDATA[*/
    
      #leftContent {
        width: 500px;
        }
    
      table {
        border-spacing: 10px;
        width: 100%;
        }
    
      tr {
        vertical-align: top;
        text-align: left;
        }
    
      th {
        color: #600;
        }
        
        /*]]>*/
      </style>
    </head>
    
    <body>
      <div id="leftContent">
        <table summary="Contact info for each branch">
          <thead>
            <tr>
              <th>&nbsp;</th>
    
              <th>Deerlodge Location</th>
    
              <th>Westwood Location</th>
            </tr>
          </thead>
    
          <tbody>
            <tr>
              <th>Address</th>
    
              <td>2143 Portage Ave.
              <br />
              Winnipeg, MB R3J OL4</td>
    
              <td>3236 Portage Ave.
              <br />
              Winnipeg, MB R3K 0Y94</td>
            </tr>
    
            <tr>
              <th>Phone</th>
    
              <td>204-953-1655</td>
    
              <td>204-953-1650</td>
            </tr>
    
            <tr>
              <th>Email</th>
    
              <td colspan="2">info@nessphysiotherapy.com</td>
            </tr>
          </tbody>
        </table>
      </div>
    </body>
    </html>
    cheers,

    gary

    Comments on this post

    • Arem agrees : I see trees, Gary sees a wood...
    There are those who manage to build a web site without knowing what they're doing; thereby proving to themselves they do, indeed, know what they're doing.

    My html and css workshop, demos and tutorials.
    Ask a better question, get a better answer.

IMN logo majestic logo threadwatch logo seochat tools logo