Jump to content

What's up with the XHTML validator?


elementalgrace

Recommended Posts

Has anyone else found that even though you have no errors it still tells you that your code won't validate? I have a warning for a label (apparently the validator doesn't like my label name, heaven forbid)but no errors in my code and still the dratted thing won't validate ...This seems crazy to me ...

Link to comment
Share on other sites

I know the validator won't fully validate your document unless you have the content-type meta tag on it... that could be your problem, but I'm not sure unless you copy/paste the warning you are getting here.

<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

That would be the right content-type unless you are making a page using a different character set (e.g. Japanese, Chinese).

Link to comment
Share on other sites

I know the validator won't fully validate your document unless you have the content-type meta tag on it... that could be your problem, but I'm not sure unless you copy/paste the warning you are getting here.
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />

That would be the right content-type unless you are making a page using a different character set (e.g. Japanese, Chinese).

The validation result for the index page (all pages coming out the same) is hereThe HTML is here (it's rather long due to all the curved corners, sorry):
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml" ><head>	<title>East Meets West</title>	<meta content="text/html;charset=utf-8" http-equiv="Content-Type" /> 	<link href="images/styles.css" rel="stylesheet" type="text/css" />	<meta content="" name="keywords" />	<meta content="" name="description" />	<meta content="" name="abstract" /></head><!--ALL--><body>	<div id="all">		<div id="main">	   <div id="header">	   <ul>		   <li><a href="#" class="on">Home</a></li>		   <li><a href="#">Catalogue</a></li>		   <li><a href="#">Product Information</a></li> 		   <li><a href="#">Members</a></li>		   <li><a href="#">Basket</a></li> 		   <li><a href="#">Contact</a></li> 	   </ul>	   </div>			<!--LEFT-NAV -->			<div class="leftnav">				<!--LEFT-NAV POD1 -->				<div class="left-box">					<div class="left-t">						<div class="left-b">							<div class="left-l">								<div class="left-r">									<div class="left-tl">										<div class="left-tr">											<div class="left-bl">												<div class="left-br">													<div class="left">														<ul class="left-search">															<li>Quick Search</li>															<li><label for="txtKeyword">  </label>																<input id="txtKeyword" maxlength="55" name="txtKeyword" title="Enter Keyword" type="text" /></li>															<li>																<label for="btnSubmit">  </label>																<input class="submit" name="btnSubmit" type="submit" value="go!" /></li>														</ul>													</div>												</div>											</div>										</div>									</div>								</div>							</div>						</div>					</div>				</div>				<!--END: POD1 -->  								<!--POD 2-->				<div class="left-box">					<div class="left-t">						<div class="left-b">							<div class="left-l">								<div class="left-r">									<div class="left-tl">										<div class="left-tr">											<div class="left-bl">												<div class="left-br">													<div class="left">														<ul>															<li>Browse Products</li>															<li><a href="#">Boxes</a></li> 															<li><a href="#">Lights & Lamps</a></li> 															<li><a href="#">Ornaments</a></li>															<li><a href="#">Jewellery</a></li>															<li><a href="#">Furniture</a></li>															<li><a href="#">Decorations</a></li>															<li><a href="#">Rugs</a></li> 															<li><a href="#">Special Offers</a></li> 														</ul>													</div>												</div>											</div>										</div>									</div>								</div>							</div>						</div>					</div>				</div>				<!--END: POD2-->						 </div>			<!--CONTENT -->			<div id="content-area">				<!-- BEGIN:MAIN BOX -->				<div id="main-container">					<div class="main-box">						<div class="main-t">							<div class="main-b">								<div class="main-l">									<div class="main-r">										<div class="main-tl">											<div class="main-tr">												<div class="main-bl">													<div class="main-br">														<div class="main-content">															<!-- BEGIN:MAIN BOX -->															<div class="clear">																 </div>															<!--PAGE-CONTENT OUTSIDE PODS -->															<div class="container">																																<div id="breadcrumb">																	<a href="#">Home</a> > New Messages</div>																<h1>																	Lorem Ipsum Dolor Amet</h1>																<p>																	Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Ut et quam. Aenean sem libero, fringilla quis, pellentesque vel, viverra eget, dui. Quisque lobortis. Pellentesque a felis. <a href="#">Praesent consectetuer augue sit amet mauris</a>. Maecenas adipiscing, dui sit amet auctor dapibus, lectus massa sollicitudin dui, nec pellentesque lectus turpis cursus diam. Donec tincidunt rhoncus odio. Nam sodales ipsum eu erat. Donec facilisis, orci in malesuada commodo, est nisl rhoncus nisl, ac commodo diam mauris quis quam. Mauris iaculis, dui quis condimentum vulputate, odio nunc aliquam purus, non ullamcorper nunc diam at leo. Nulla non leo. Nulla in velit. Nam ultricies sapien nec turpis. </p>																<div class="products">																<table border="0" cellspacing="8" class="products">																	<tr>																		<td>																			<div><img alt="" src="images/product1.jpg" /></div>																			<div><a href="#">Tableware</a></div>																		</td>																		<td>																			<div><img alt="" src="images/product2.jpg" /></div>																			<div><a href="#">Furniture</a></div>																		</td>																		<td>																			<div><img alt="" src="images/product3.jpg" /></div>																			<div><a href="#">Ornaments</a></div>																		</td>																		</tr>																																	  																</table></div>															   </div>															   														<!--END: PAGE-CONTENT -->														<br clear="all" />													</div>												</div>											</div>										</div>									</div>								</div>							</div>						</div>					</div>				</div>			</div>			<!--END:MAIN BOX -->		</div>		<!--END: CONTENT -->		<div class="clear">		</div>	</div>	<!-- END MAIN -->	<div class="credit1">Website Design: <a href="http://www.xxxx.co.uk" target="_blank">xxxxx</a>			</div></div></body></html>

... and the CSS here:

body{	margin: 2px;	background-color: #ffffff;}/* Everything */#all{	margin: auto;	width: 770px;	max-width: 770px;	background-color: #ffffff;	text-align: left;}#main{	clear: both;	vertical-align: top;	margin:0;	padding:0;}/*HEADER AND TOP NAVIGATION*/#header{	background: url(../images/header.jpg) no-repeat 0px 0px;	height: 197px;}#header ul{	padding-top: 10px;}#header li{	display: inline;	padding-left: 8px;	padding-right: 8px;}#header li a{	font: bold 100% arial, sans serif;	font-size: medium;	color: #cc6346;	text-decoration: none;}#header li a:hover{	color: #5291C2;	text-decoration: none;}#header li a.on{	color: #a9a9a9;}/*BREADCRUMB TRAIL*/#breadcrumb{	padding-top: 10px;	text-align: right;	margin-right: 20px;	font: 75% arial,sans-serif;	color: #474747;	text-decoration: none;}#breadcrumb a{	font: 100% arial,sans-serif;	text-decoration: none;	color: #cc6346;}#breadcrumb a:hover{	color: #5291C2;	text-decoration: none;}#breadcrumb a.on{	color: #a9a9a9;}/*TEXT, LINKS ETC*/h1{	margin: 15px;	padding-top: 5px;	font: bold 97% Arial, Helvetica, sans-serif;	color: #5291C2;}h2{	margin: 7px 20px;	padding-top: 5px;	padding-bottom: 5px;	font: bold 96% Arial, Helvetica, sans-serif;	color: #a2a2a2;}p{	font: 75% arial,sans-serif;	line-height: 150%;	text-align: left; } .container p{	width: 90%;	margin-left: 15px;	color: #474747;}ul{	padding-left: 15px;	margin-left: 0px;}li{	font: 82%/17px arial,sans-serif;	margin-left: 0px;	color: #02a1d8;	text-decoration: none;}a{	color: #cc6346;}a.on{	color: #a9a9a9;}a:hover{	color: #5291C2;	text-decoration: none;}/* LEFT, LEFT NAVIGATION AND LEFT SEARCH BOX*/.leftnav{	float: left;	margin-top: 8px;	width: 23%;}.left-box{	background-color: #ffffff;	border: 1px solid #ffffff;}.left{	padding-top: 4px;	padding-bottom: 15px;}.left-tl{	background: url(../images/left-tl.gif) no-repeat 0px 0px;	position: relative;}.left-tr{	background: url(../images/left-tr.gif) no-repeat 100% 0px;	position: relative;}.left-bl{	background: url(../images/left-bl.gif) no-repeat 0px 100%;	position: relative;}.left-br{	background: url(../images/left-br.gif) no-repeat 100% 100%;	position: relative;}.left-t{	background: url(../images/left-t.gif) repeat-x 0px 0px;	position: relative;}.left-b{	background: url(../images/left-b.gif) repeat-x 0px 100%;	position: relative;}.left-l{	background: url(../images/left-l.gif) repeat-y 0px 0px;	position: relative;}.left-r{	background: url(../images/left-r.gif) repeat-y 100% 0px;	position: relative;}.leftnav ul{	list-style-type: none;}.leftnav li{	font: bold 100% arial, sans-serif;	color: #5593C3;	margin-left: 7px;	padding-top: 5px;	text-decoration: none;}.leftnav li a{	font: normal 83% arial, sans-serif;	color: #cc6346;	text-decoration: none;}.leftnav li a:hover{	color: #5291C2;	text-decoration: none;}.leftnav li a.on{	color: #a9a9a9;	text-decoration: underline;}.left-search li{	font: bold 100% arial, sans-serif;	color: #5593C3;	margin-left: 7px;	padding-top: 5px;	text-decoration: none;}.left-search li label{	width: 0px;	text-decoration: none;}.left-search input{	width: 100px;	border: solid 1px #474747;	font: normal 80% arial, sans-serif;	color: #474747;}.left-search input.submit{	width: 104px;	color: #cc6346;	border: 1px solid #474747;}/* CONTENT AND CONTENT AREA */#content-area{	margin-top: 5px;	float: right;	width: 77%;}#main-container{	padding-left: 2px;	padding-bottom: 2px;	margin: 2px 0px 2px 2px;	padding-top: 2px;}.main-box{	background-color: #ffffff;	border:1px solid #ffffff;}.main-tl{	background: url(../images/main-pod-tl.gif) no-repeat 0px 0px;	position: relative;}.main-tr{	background: url(../images/main-pod-tr.gif) no-repeat 100% 0px;	position: relative;}.main-bl{	background: url(../images/main-pod-bl.gif) no-repeat 0px 100%;	position: relative;}.main-br{	background: url(../images/main-pod-br.gif) no-repeat 100% 100%;	position: relative;}.main-t{	background: url(../images/main-pod-top.gif) repeat-x 0px 0px;	position: relative;}.main-b{	background: url(../images/main-pod-bottom.gif) repeat-x 0px 100%;	position: relative;}.main-l{	background: url(../images/main-pod-l.gif) repeat-y 0px 0px;	position: relative;}.main-r{	background: url(../images/main-pod-r.gif) repeat-y 100% 0px;	position: relative;}.container{	margin: 27px;	background: none;	padding-bottom: 10px;     }.box{	background-color: #F6F4F4;	margin: 25px;	border: 1px solid #ffffff;}/*PRODUCT PAGE*/#productpic {	float: left;	width:150px;	border: 1px solid #ffffff;}#productpic img{	margin-top:5px;}#productdesc{	float: left;	width: 370px;	text-align:left;	border: 1px solid #ffffff;}#productdesc p input{	color: #cc6346;	border: 1px solid #474747;	background-color:#ffffff;	font: normal 100% arial, sans serif;}/*CATALOGUE / PRODUCT TABLE*/.products{	margin: auto;	text-align: center;}table.products{	display: inline;}table.products tr td{	font: normal 80% arial,helvetica,sans-serif;	text-align: center;	width: 150px;}table.products tr td img{	border: 0px solid #777777;	margin: 10px 0 4px 0;	width: 150px;	height: 150px;}table.products tr td a{	color: #cc6346;	text-decoration: none;}table.products tr td a:hover{	color: #5291C2;	text-decoration: none;}table.products tr td a.on{	color: #a9a9a9;	text-decoration: none;}/*CREDIT*/.credit1{	clear: both;	margin-top: 10px;	margin-right: 10px;	font: 75% arial;	color: #474747;	text-align: right;	text-decoration: none;	border: 1px solid #ffffff;}.credit1 a{	color: #5593C3;	text-decoration: none;}.credit1 a:hover{	text-decoration: underline;}/*MISCELLANEOUS*/.clear{	clear: both;}.red{	padding-right: 0px;	padding-left: 22px;	font-size: 10px;	padding-bottom: 18px;	color: red;	padding-top: 22px;	font-family: arial,Sans-Serif;}/* FORMS */.container ul{	width: 95%;	height: auto;	text-align: left;	text-decoration: none;	list-style-type: none;}.container li{	list-style: none;	font: 89% arial, sans-serif,;	padding-top: 5px;	padding-bottom: 5px;}.container label{	font: 89% arial, sans-serif;	color: #474747;	width: 12em;	float: left;	text-align: left;	margin-right: 0.5em;	display: block;}.container input{	color: #474747;	font-size: 89%;	width: 40%;	border: 1px solid #474747;}.container textarea{	width: 40%;	font: 89% arial, sans-serif;	color: #474747;	border: 1px solid #474747;}.container checkbox{	border: 0px solid #ffffff;}input.submit{	color: #cc6346;	width: 70px;	border: 1px solid #474747;	background: #ffffff;	margin-left: 0px;}select{	border: 1px solid #474747;	width: 41%;	color: #474747;	background: #ffffff;	margin-left: 0px;	font: 82% arial, sans-serif;}.LinkButton{	font-size: 25%;	vertical-align: top;	width: 69px;	color: #cc6346;	margin-right: 5px;	font-family: arial, Sans-Serif;	text-align: center;	text-decoration: underline;}.LinkButton:Hover{	font-size: 89%;	vertical-align: top;	width: 69px;	color: #cc6346;	margin-right: 5px;	font-family: arial, Sans-Serif;	text-align: center;	text-decoration: underline;}/*SHOPPING BASKET*/table.shopping{width:525px;text-align:center;margin:auto;}table.shopping tr td{	padding: 2px;	font: normal normal 75% arial,helvetica,sans-serif;	color: #777777;	text-align: center;	background-color: #f5f5f5;}table.shopping tr th{	padding: 5px;	font: normal bold 80% arial,helvetica,sans-serif;	color: #fff;	text-align: center;	background-color: #cc6346;}.shopping a{	color: #cc6346;	text-decoration: underline;}.shopping input{	width:50px;	border: 1px solid #474747;}.shopping tr td.buttons{	background-color: #fff;	text-align: right;	padding: 10px 0 0 0;}.shopping tr td.shop-small{width:100px;}.shopping tr td.buttons input{	border: 1px solid #033C20;	color:#cc6346;	background-color: #ffffff;	font-size:small;	text-align: center;	width:150px;}/*STATS*/.statstable{	font: 100% arial,sans-serif;	text-align: left;	text-decoration: none;	color: black;	font-family: arial;	text-decoration: none;}

Link to comment
Share on other sites

it is complaining about this

<label for="btnSubmit">  </label><input class="submit" name="btnSubmit" type="submit" value="go!" />

You do not have an id named btnSubmit only name=This will fix it

<label for="btnSubmit">  </label><input class="submit" name="btnSubmit" id="btnSubmit" type="submit" value="go!" />

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...