Table and Validation Issues

Discussion in 'Web Design and Development' started by ezkimo, Jul 23, 2007.

  1. ezkimo macrumors regular

    Joined:
    Sep 12, 2002
    #1
    Hiya,
    I'm altering an existing template for somebody, and I'm having trouble getting it to validate because of the damn tables. I really don't use tables much in favor of a css based layout, so I have very little experience in trying to figure out what the validator is trying to communicate to me. It seems what it tells me contradicts itself! Arggg..

    If anyone could provide some insight into this tables mess it would be beyond appreciated.

    Thanks!

    -Zach

    (I've removed some of the superfluous stuff to make it a little simpler)

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
     "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    <title></title>
    
    
    </head>
    <body >
    <div id="mainwrap">
    	<div id="header">
        
    	<div id="headermsg"></div>
    	
    		<div id="outer">
    
    <ul>
    
    <li>
    <span class="xb1">
    <a href="express">
    <b class="hidden">
    DDD
    </b></a>
    </span>
    </li>
    
    <li>
    <span class="xb2">
    <a href="full">
    <b class="hidden">
    CCC
    </b></a>
    </span>
    </li>
    
    <li>
    <div class="xb3">
    <a href="group">
    <b class="hidden">
    BBB
    </b></a>
    </div>
    </li>
    
    <li>
    <div class="xb4">
    <a href="past">
    <b class="hidden">
    AAA
    </b></a>
    </div>
    </li>
    </ul>
    
    
    		
    		</div>		
    		
    		
    			<div id="submenu1">
    	<a href="display/menufilter/madhus" title="menu filter">menu filter</a>	</div>
    	<div id="submenu2">
    	<a href="account/home/at/madhus" title="my account">my account</a>   <a href="services/login/at/madhus" title="log in">log in</a>	</div>		
    	
    
    	
    	</div>
    	<div id="wrapper">
    	
    
    
    
    
    
    
    <!-- Begin page layout table -->
    <table id="maintable" border="0" width="100%">
    
    <tr>
    		<td class="tdHead" colspan="3" valign="top"> 
    	<div id="headBoard">		  
    		<div id="timeselection">
    		
    		<a class="novisitedlink" href="">Breakfast (8 am - 10 am)</a>
    		<a class="novisitedlink activetime" href="">Lunch (11 am - 1 pm)</a>
    		<a class="novisitedlink" href="">Dinner (5 pm - 10 pm)</a>
    		
    		</div>
    		
    		<div id="customizeHeader">
    				</div>
    	</div>
    	
    </td>
    </tr>
    
    
    <td id="leftCol" valign="top">
    	
    <div class="intro2"> </div>
    <div id="main">
    <div class="description">
    
    <p>
    Street Address <input type="text" name="Coupon" value="" style="width: 200px" /> <br />
    City <input type="text" name="Coupon" value="" style="width: 260px" /> <br />
    State <input type="text" name="Coupon" value="" style="width: 124px" />
    Zip <input type="text" name="Coupon" value="" style="width: 100px" />
    </p>
    
    <p style="background-color: #f8e081;">
    <i>optional</i> <br />
    
    <textarea name="comments" cols="20" rows="7" style="float:right; margin-right: 20px;"></textarea>Landmarks,
    cross streets,
    Special instructions
    <br /><br /><br /><br /><br /><br />
    Company <input type="text" name="Coupon" value="" style="width: 235px;" /> <br />
    Suite <input type="text" name="Coupon" value="" size="13" />
    Floor <input type="text" name="Coupon" value="" size="13" /> <br />
    <input type="checkbox" name="Leave with doorman" /> Please leave with doorman if not home <br />
    <input type="checkbox" name="Call Before Delivery" /> No phone/intercom, please call before 
    delivery 
    </p>
    <a href="#">delete</a>
    </div>
    </div>
    
    <div class="customize2">
    <a href="#">
    New Address
    </a>
    </div>
    
    <a href="#">
    <b class="basketitem">
    </b>
    </a>
    
    </div>
    </td>
    
    
    
    
    
    
    
    
    
    
    
    <td id="centerCol" valign="top"> <!-- Center Column -->
    	
    <div class="intro2"> </div>
    <div id="main2">
    <div class="description">
    
    <p>
    Street Address <input type="text" name="Coupon" value="" style="width: 200px" /> <br />
    City <input type="text" name="Coupon" value="" style="width: 260px" /> <br />
    State <input type="text" name="Coupon" value="" style="width: 124px" />
    Zip <input type="text" name="Coupon" value="" style="width: 100px" />
    </p>
    
    <p style="background-color: #f8e081;">
    <i>optional</i> <br />
    
    <textarea name="comments" cols="20" rows="7" style="float:right; margin-right: 20px;">
    </textarea>
    Landmarks,
    cross streets,
    Special instructions<br /><br /><br /><br /><br /><br />
    Company <input type="text" name="Coupon" value="" style="width: 235px;" /> <br />
    Suite <input type="text" name="Coupon" value="" size="13" />
    Floor <input type="text" name="Coupon" value="" size="13" /> <br />
    <input type="checkbox" name="Leave with doorman" /> Please leave with doorman if not home <br />
    <input type="checkbox" name="Call Before Delivery" /> No phone/intercom, please call before 
    delivery 
    </p>
    <a href="#">delete</a>
    </div>
    </div>
    
    
    <div class="customize">
    <a href="#">
    Save Changes
    </a>
    </div>
    
    <a href="#">
    <b class="basketactionbuttons"></b>
    </a>
    
    
    
    </td>
    </table>
    </div>
    
    <!-- end page layout table -->
    
    
    
    
    	<div id="footer">
    	<p>
    	<a href="display/contact/madhus" class="novisitedlink">Contact Us</a>   |   <a href="display/printmenu/madhus" class="novisitedlink">Print Menu</a>   |   <a href="display/faq/madhus" class="novisitedlink">FAQ</a>	</p>
    	
    
    	
    	</div>
    
    </body>
    </html>
     
  2. zim macrumors 65816

    zim

    Joined:
    Jan 5, 2002
    #2
    Just did a quick look at your source but it appears that you have some issues with your closing </div>'s. I recommend that you take another run through it. Also you have <td>'s just floating in your <table>. The <td>'s should be inside a <tr>.

    Code:
    <table>
      <tr>
        <td></td>
      </tr>
    </table>
    When you validate with the w3c validator it should give you the list of errors along with line numbers.
     
  3. ezkimo thread starter macrumors regular

    Joined:
    Sep 12, 2002
    #3
    Hi Zim,
    Thanks for your reply.

    I've been fiddling, and simplified everything to:

    HTML:
    <table id="maintable" border="0" width="100%">
    	<tr>
    		<td class="tdHead" colspan="3" valign="top"> 
    		</td>
    
    		<td id="leftCol" valign="top">	
    		</td>
    
    		<td id="centerCol" valign="top"> 
    		</td>
    </tr>
    </table>
    
    Which validates. So something inbetween must be causing problems, but the only errors that the validator gives relate to the table tags, so I really have no idea what is going on :confused:
     
  4. zim macrumors 65816

    zim

    Joined:
    Jan 5, 2002
    #4
    Okay, that clears up your table so now it looks like it is just the mixed up <div>'s. Somewhere you have one that isn't closed properly and with a declaration of xhtml 1.0 strict will require that every tag is properly closed.

    My quick look shows that it might be that your <div id="mainwrap"> is never properly closed at the end of the content.
     
  5. Matteh117 macrumors regular

    Joined:
    May 24, 2007
    Location:
    Surrey, UK
    #5
    Just a tip - get into the habit of using indents.. it helps a lot (ie. when you have a problem you can't see initially... now). :)
     
  6. jng macrumors 65816

    jng

    Joined:
    Apr 6, 2007
    Location:
    Germany
    #6
    PS - the w3 validator does a really good job of finding the error for you. Also select view source, so you can reference line numbers.

    Instead of posting the code, post the link and run it through the validator.

    Would save us (and you) loads of time.
     
  7. ezkimo thread starter macrumors regular

    Joined:
    Sep 12, 2002
    #7
    Thanks for the tip. I generally do indent but the code was kind of a mess to begin with, so I was straightening it out more then anything.

    I fixed the problem. There was an extra closing div tag:mad: :( floating about.

    It was confusing because as I remembered it, the validator used to tell me when there was an extra closing tag floating around, and it only referenced the table as being at fault.

    Thanks for helping out everyone!
     

Share This Page