I want to make this code here:
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" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>Contact Us Slide-Out Demo</title>
<link rel="stylesheet" href="contact.css"/>
<script src="http://jqueryjs.googlecode.com/files/jquery-1.3.js" type="text/javascript"></script>
<script src="jquery.easing.1.3.js" type="text/javascript"></script>
<script src="contact.js" type="text/javascript"></script>
</head>
<body>
<div id="contactArea">
<form>
<div id="info">
<label for="author">Name</label>
<input type="text" name="author" id="author" value="" size="22" tabindex="1" class="rounded" aria-required='true' />
<label for="email">Email</label>
<input type="text" name="email" id="email" value="" size="22" tabindex="2" class="rounded" aria-required='true' />
<label for="url">Website</label>
<input type="text" name="url" id="url" value="" size="22" tabindex="3" class="rounded" />
</div>
<div id="message">
<label for="comment">Your Message</label>
<textarea name="comment" id="comment" cols="2" rows="2" tabindex="4" class="rounded"></textarea>
<input name="submit" type="submit" id="submit" class="rounded" tabindex="5" value="Submit" />
</div>
</form>
</div>
<div id="container">
<div id="header" class="container"></div>
<a class="contact" href="#">Contact Us</a>
</div>
<div class="content">
<h1>Contact Us Slide-Out Area using jQuery</h1>
<p>Click the contact us button above</p>
</div>
</div>
<div id="footer">
<a class="back" href="http://inspectelement.com/tutorials/animate-a-contact-us-slide-out-area-using-jquery">Back to tutorial</a>
<a href="http://inspectelement.com"><img src="logo.gif" height="44px" width="300px" alt="Inspect Element Logo" /></a>
</div>
</body>
</html>
Go into this webpage here, so that the contact form is an AJAX drop down bar. The code for my homepage can be found below. Problem is, when I do this, I get layout errors!
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>
<meta name="generator" content="HTML Tidy for Linux (vers 6 November 2007), see www.w3.org" />
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Downing Web Design - Product Portfolio</title>
<link rel="stylesheet" href="css/style.css" type="text/css" media="all" /><!--[if lte IE 6]><link rel="stylesheet" href="css/ie6.css" type="text/css" media="all" /><![endif]-->
<script type="text/javascript" src="js/jquery-1.2.3.pack.js">
</script>
<script type="text/javascript" src="js/jquery.jcarousel.pack.js">
</script>
<script type="text/javascript">
//<![CDATA[
jQuery(document).ready(function() {
jQuery('#mycarousel').jcarousel({
scroll: 1,
animation: "slow",
wrap: "both"
});
});
//]]>
</script>
</head>
<body>
<!-- Header -->
<div class="shell" id="header">
<div class="cl"> </div>
<!-- Logo -->
<div id="logo-cnt">
<h1 id="logo">Downing Web Design</h1>
<h2 id="slogan">Adam Downing's Web Portfolio</h2>
</div>
<!-- End Logo -->
<div id="status">
<p class="available">Call Me: <strong><a href="skype:+447801233070">07801233070</a></strong></p>
</div>
<div class="cl"><strong> </strong></div>
<!-- Carousel -->
<div id="slider">
<ul id="mycarousel">
<li>
<div class="img-cnt"><strong><a href="#"><img src="css/images/portfolio-item-1.gif" alt="" /></a></strong></div>
</li>
</ul>
</div>
<!-- End Carousel --></div>
<!-- End Header -->
<!-- Main -->
<div class="shell" id="main"><strong><!-- Article --></strong>
<div class="article">
<h2><strong>About Me</strong></h2>
<p><strong>I'm a College student studying Business Studies Level 3, and have been interested in web design for the past 5 years. I have developed my skills into HTML, CSS and basic PHP. I ensure that the websites I create are displayed on the portfolio and are to the best of my standard. Recenlty, I have decided to sell my skills in the creation of websites for other people.</strong></p>
</div>
<!-- End Article -->
<!-- Gallery -->
<div class="gallery">
<div class="cl"><strong> </strong></div>
<h2 class="left"><strong>Product Portfolio</strong></h2>
<div class="cl"><strong> </strong></div>
<div class="cl"><strong> </strong></div>
<div class="portfolio-item"><strong><a href="/allroads"><img src="css/images/port-1.gif" alt="" /></a> <a href="/allroads">All Roads Driving School</a></strong></div>
<div class="cl"><strong> </strong></div>
</div>
<!-- End Gallery -->
<!-- Contact -->
<div class="article">
<h2><strong>Contact me?</strong></h2>
<form action="email.php">
<div class="cl"><strong> </strong></div>
<div class="column-cnt">
<div class="cl"><strong> </strong></div>
<div class="column"><strong><label for="your-name">Your Name?</label> <span class="text-field"><input type="text" id="name" value="" /></span></strong></div>
<div class="column"><strong><label for="your-email">Your E-mail address?</label> <span class="text-field"><input type="text" id="email" value="" /></span></strong></div>
<div class="cl"><strong> </strong></div>
<p><strong>You can call me anytime for a quote on <strong>07801233070</strong>. Alternatively, you can use the contact form below and I will get back to you usually within 12-24 hours! My web design prices are usually cheap and I can cater for just about anyones needs!</strong></p>
</div>
<div class="column-big"><label for="your-message">Your Message</label> <span class="text-area">
<textarea id="message" rows="" cols="">
</textarea></span> <input type="submit" value="Send" /></div>
<div class="cl"> </div>
</form>
</div>
<!-- End Contact --></div>
<!-- End Main -->
<div id="footer">
<p>© <a href="http://www.downingwebdesigns.com/">DowningWebDesign</a></p>
</div>
</body>
On a side note, I got all my HTML valid.
Bookmarks