Header/Layout Problems

Hey Guys

You can find my site at


www.downingwebdesign.com/notworkingcontact

I am trying to implement this script but it is causing errors to the layout and I cannot work out why. You can view the source on the webpage.


http://inspectelement.com/tutorials/animate-a-contact-us-slide-out-area-using-jquery/

Any help appreciated, I will possibly make a donation to people who help out with my issues!

The css, html and js seem to be working (at least in Firefox). Your problem is with the PHP—a parse error on submit. We can’t help with that unless you post the PHP being used. Then we can move this to the PHP forum.

Is the only problem you see once the form is submitted, or is there another problem in some browser?

EDIT: or check this out: http://www.parse-error-unexpected-t-string.com/

Thanks for your reply. I am using Google Chrome and it doesn’t work proper. Can you download TeamViewer and send me a message so you can control my computer and ‘‘teach’’ me what i’m doing wrong?

Edit, FireFox neither works, I think you misunderstand my problem. I can write the PHP script and I stopped half way to solve layout issues. If you look where the text is on

/notworkingcontact

And look where it is on

downingwebdesign.com

Then you will see the issue. I want to include the contact us page on the homepage of downingwebdesign.com. Please download TeamViewer and assist me :slight_smile:

This site will “teach” you. :wink:

Will fixing the problems here sort my layout issues?
I don’t understand all that posh talk. Could someone correct my layout issues and post code here so I can look at my code and learn my errors?

You need to produce valid HTML, you are not. That site tells you why you are not - first produce valid HTML, then look to style it.

I used a site template for my portfolio, as I wanted to use the carousel. Do you have Teamviewer to help me? I can pay…

Let me say this, if you’re looking to sell websites/pages, you need to learn how to write good code.

You’re in the best place possible to learn how to do this, but you need to put in the most effort. Other members will help you along, for free, if you can prove you’re trying and are appreciative.

Be polite, open to advice and explicit in what you want.

So, with that in mind. Visit the validator, start at the top and work your way down fixing as you go.

If/when you get stuck on a particular issue, just pop a post on the end of this thread.

Good luck!

Anthony.

I did that but i’m not so good at English. I can design and sell webpages but I am not so good when it comes to having multiple CSS/JS scripts on one page. Can you please explain this one to me:


You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".


Line 83, column 91: end tag for "a" omitted, but OMITTAG NO was specified
&#8230;ilable">Call Me: <strong><a href="skype:+447801233070">07801233070</strong></p>

I will try with the validator again.


You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

That is saying you are using html tag while your DOCTYPE is XHTML. Like Anthony said you need to produce good code, before you should attempt to sell/market it.


Line 83, column 91: end tag for "a" omitted, but OMITTAG NO was specified
&#8230;ilable">Call Me: <strong><a href="skype:+447801233070">07801233070</strong></p>

this tells you exactly what’s wrong, as long as you know how or understand code.

I don’t mean this rudely

I am trying to produce good code but with using a template for my portfolio and another script for contact us ajax, it is kinda going against eachother.

I have sorted all my errors now and it says is passes. How do I go about making the layout proper again?

Proper in what way?

I want to make this code here:



<!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!


<!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.

Did Zarin answer your question?

No not really, I would have preferred the slide down AJAX contact form but looks like its not happening.