page is validate, but everything messed up

**san_crazy** · 11-02-2008, 06:48 AM

I have validated my page successfully at w3c validation center. OK, I am just giving the screen shots what did I get before and after the page validation:

page URL:
http://www.stripathi.110mb.com/resourcespage.html

CSS URL:
http://www.stripathi.110mb.com/exter...ourcestyle.css
http://www.stripathi.110mb.com/exter...eader_menu.css

1 .the interesting issue is, at first I have had not included the !DOCTYPE declaration,
the output in IE7.0 looked like this
http://codingforums.com/attachment.p...2&d=1225604703

the output in FF2.0.0.x looked like this
http://codingforums.com/attachment.p...3&d=1225604838

2. when I included the !DOCTYPE declaration at top then I got every thing messed up in IE but few of those in FF.
the output in IE--
http://codingforums.com/attachment.p...4&d=1225605007

http://codingforums.com/attachment.p...5&d=1225605085

the one thing that I don't get is, the page was running as I expected before validating it and without fixing the errors and warnings, but when I got each error/warning removed and fixed everything accordingly, then I got it messed up.

the style sheet at first link doesn't have its effect to make every element in its proper position and looks accordingly.

thanks in advance

**bluewalrus** · 11-02-2008, 10:49 PM

Browsers may have been guessing which doc type you were trying to using before and when specified it wouldnt be guessing so it'd display the way the one stated would. I usually use the transitional doctype or strict yours isn't valid there. This is close to being valid in there though if you want to try this:

Code:

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
 <!--  Created with the CoffeeCup HTML Editor 2008  -->
<!--           http://www.coffeecup.com/           -->
<!--        Brewed on 10/30/2008 6:53:15 AM        -->
<link rel="stylesheet" type="text/css" href="http://www.stripathi.110mb.com/external/stylesheets/header_menu.css" />
<link rel="stylesheet" type="text/css" href="http://www.stripathi.110mb.com/external/stylesheets/resourcestyle.css" />
<script type="text/javascript" language="javascript">
function verifyMe(element) {
	  if(document.getElementsByTagName("input")[0].value!=""){
		element.action ="http://www.google.com/search";
		element.submit();
		 }
		 else alert("Please enter a quary"); 	 
	   	 }
  </script>
</head>
<body bgcolor="#EFFFFB">  
   <div id="personalhead">
    <form action=""  onSubmit="return verifyMe(this)">
      <input id="query" type="text" maxlength="2048" size="55" name="q" />
	  <input id="button" type="submit" name="btnG" value="Google Search" />
	</form> 
   </div>
    <div id="header"></div>
   <div id="mainbg">
      <div id="leftpane">
	    <a id="insidelp">Programming Tuts</a>
	     <ul>		  
		  <li><span><a href="/interestspage.html">C</a></span></li>
		  <li><span><a href="/photo.html">C++</a></span></li>
		  <li><span><a href="/contactpage.html">Java</a></span></li>
		  <li><span><a href="/resourcespage.html">Resources</a></span></li>

		  <li><span><a href="/photo.html">Courses</a></span></li>
		  <li><span><a href="/linkspage.html">Links</a></span></li>
		  <li><span><a href="/extrapage.html">Extra</a></span></li>
		  <li><span><a href="/photo.html">Site Map</a></span></li>
		</ul>
		 <a style="position:relative;left:3px;top:0px;border:none;background-image:url('http://localhost/WebSite/external/images/smoth.png');height:28px;width:142px;color:white;text-align:center;padding-top:7px;">Web Tutorials</a>

	     <ul>		  
		  <li><span><a href="/interestspage.html">Interests</a></span></li>
		  <li><span><a href="/photo.html">Photos</a></span></li>
		  <li><span><a href="/contactpage.html">Contacts</a></span></li>
		  <li><span><a href="/resourcespage.html">Resources</a></span></li>
		 
		</ul>
	  </div>	  
   </div>

   <a style="position:absolute;left:106px;top:211px;"><img  src="http://www.stripathi.110mb.com/external/images/resuppbg.png" alt="body" /></a>
   <a style="position:absolute;left:105px;top:1029px;"><img  src="http://www.stripathi.110mb.com/external/images/reslowbg.png" alt="body" /></a>  
   <div id="toppane">
	    <ul>		  
		  <li><span><a href="/index.html">Home</a></span></li>
		  <li><span><a href="/interestspage.html">Interests</a></span></li>
		  <li><span><a href="/photo.html">Photos</a></span></li>
		  <li><span><a href="/contactpage.html">Contacts</a></span></li>

		  <li><span><a href="/resourcespage.html">Resources</a></span></li>
		  <li><span><a href="/photo.html">Courses</a></span></li>
		  <li><span><a href="/linkspage.html">Links</a></span></li>
		  <li><span><a href="/extrapage.html">Extra</a></span></li>
		  <li><span><a href="/photo.html">Site Map</a></span></li>
		</ul>
	</div>
</body>
</html>

Thread: page is validate, but everything messed up

Thread Tools

Search Thread

page is validate, but everything messed up

Bookmarks

Bookmarks

Posting Permissions