Validation Output: 2 Errors

Lpmraven · 05-05-2011, 06:40 PM

Hey guys, I'm kind of new to coding, I started working on websites a few years ago doing the design and artwork. So i am trying to learn new stuff and put together some good sites to go in my "folder of stuff ive done".

So heres my issue, thanks if you suggest some helpful stuff.
I validate all my sites (I say all, im trying to make 3 of my first ones atm.) with http://validator.w3.org. Heres the errors I still have to fix and I can't seem to get rid of.

Line 59, Column 18: document type does not allow element "div" here

<div id="content">

Line 112, Column 17: document type does not allow element "div" here

<div id="footer">

So they are both the same kind of thing. Heres the source code. (If you are thinking WTF is with all the Plugins, well im usingSubdreamer CMS as my content management system because i'm not pro like you guys, so don't beat me down... Please

<div id="content">

<div id="left_column">
<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>
</div>

<div id="right_column">
<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>

<plugin>
<div class="plugin" id="last">
<plugin_name><h3>[PLUGIN_NAME]</h3></plugin_name>
[PLUGIN]
</div>
</plugin>
</div>

<div class="clear"></div>
</div>

Second Source:

<div id="footer">
<p>© <?php echo date(Y); ?> thefreelander.com </p>

<p>Designed and coded by Liam Raven.</p>

<p><a href="http://validator.w3.org/check?uri=referer">
<img style="border:0;width:88px;height:31px"
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>   

<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
src="http://jigsaw.w3.org/css-validator/images/vcss"
alt="Valid CSS!" />
</a>   

<a href="http://jigsaw.w3.org/css-validator/check/referer">
<img style="border:0;width:88px;height:31px"
src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
alt="Valid CSS!" />
</a>
</p>
</div>

And heres the site link if you want to see how badly I am doing: http://www.cyber-technix.com/test1/index.php

teedoff · 05-05-2011, 07:22 PM

Somehow, you have a bunch of code BELOW your closing html tag. If you move all this:

Code:

<!-- Main Content -->
<div id="content">
		<!-- Left Column Start -->
		<div id="left_column">
			
			<div class="plugin">
				
				<div class="article_title"><a class="article_title_link" href="http://www.cyber-technix.com/test1/index.php?categoryid=1&amp;p2_articleid=1">Welcome to Freelander.com</a></div><h2>If I said you were over &pound;30 MILLION richer</h2>
<h2>than you knew, what would you say?</h2>
<br />
<p>Thank you very much for choosing Subdreamer! We are nearly there now, please follow <a href="admin/index.php">this link</a> to begin updating and changing your website from the admin panel.</p><div class="article_footer"><div class="article_footer_left">Published on  May 5, 2011 by Raven</div><div class="article_footer_right"><a class="article_print_link" href="http://www.cyber-technix.com/test1/plugins/p2_news/printarticle.php?p2_articleid=1" target="_blank">Print</a><a class="article_comments_link" href="http://www.cyber-technix.com/test1/index.php?categoryid=1&amp;p2_articleid=1#comments">Comments (0)</a></div>  </div><div class="pagination"></div>
			</div>
			
			
						
						
						
					</div>
		<!-- Left Column End -->
		
		<!-- Right Column Start -->
		<div id="right_column">
			
			<div class="plugin">
				<h3>Login Panel</h3>
				<form action="http://www.cyber-technix.com/test1/index.php?categoryid=1" method="post" >
          <input type="hidden" name="login" value="login" />
          Username:<br />
          <input name="loginusername" type="text" /><br /><br />
          Password:<br />
          <input name="loginpassword" type="password" /><br /><br />
          <input class="checkbox" type="checkbox" name="rememberme" checked="checked" value="1" /> Remember Me<br />
          <input type="submit" name="Submit now" value="Login" />
          </form><br /><br />Not registered?<br /><a href="http://www.cyber-technix.com/test1/index.php?categoryid=13">Register now!</a><br /><br /><a href="http://www.cyber-technix.com/test1/index.php?categoryid=13">Forgot your password?</a>			</div>
			
			
			
			<div class="plugin">
				<h3>Latest Articles</h3>
				<a href="http://www.cyber-technix.com/test1/index.php?categoryid=1&amp;p2_articleid=1">Welcome to Freelander.com</a><br /><br />			</div>
			
			
						
						
			
			<div class="plugin" id="last">
				<h3>Contact us!</h3>
				Need to contact us?<br /><br /><a href="index.php?categoryid=5">Click here!</a>			</div>
			
		</div>
		<!-- Right Column End -->
		
		<div class="clear"></div>
</div>
<div id="footer">
<p>&copy; 2011 thefreelander.com </p>
 
<p>Designed and coded by Liam Raven.</p>
 
<p><a href="http://validator.w3.org/check?uri=referer">
	<img style="border:0;width:88px;height:31px"
        src="http://www.w3.org/Icons/valid-xhtml10"
        alt="Valid XHTML 1.0 Transitional" height="31" width="88" /></a>&nbsp;&nbsp;&nbsp;
 
    <a href="http://jigsaw.w3.org/css-validator/check/referer">
        <img style="border:0;width:88px;height:31px"
            src="http://jigsaw.w3.org/css-validator/images/vcss"
            alt="Valid CSS!" />
    </a>&nbsp;&nbsp;&nbsp;
 
<a href="http://jigsaw.w3.org/css-validator/check/referer">
    <img style="border:0;width:88px;height:31px"
        src="http://jigsaw.w3.org/css-validator/images/vcss-blue"
        alt="Valid CSS!" />
</a>
</p>
</div>

and paste it above the last </div> tag on line 55, then see what happens.

Lpmraven · 05-05-2011, 07:44 PM

Yes! All working good and fine now, just have an issue with it ALL not being centered? Any ideas?

SB65 · 05-05-2011, 07:56 PM

Code:

#wrapper {
	background: #fff;
	width: 974px; 
        margin:0 auto
}

Lpmraven · 05-05-2011, 08:28 PM

Thats great thanks, Ive tried to expand my navigation bar across the page at the top (hopefully pushing the background image down also, but it doesnt seem to be working.)

Any suggestions on how I could get that to work?

teedoff · 05-05-2011, 08:36 PM

Probably going to have to move the navigation elements out from within your wrapper, ABOVE your header div.

That may cause other problems though, depending on those header images you have.

Actually that wont work, since you've a background image defined on the body. You're going to have to rework your header with regards to that background image. Essentially you could remove the header and nav divs to outside your wrapper div, then set that image thats on the body as the header background...I think..lol

Lpmraven · 05-05-2011, 08:43 PM

hmmm... yeah, I wonder if moving the background away from the top to a fixed distance will work?

How would I code a fixed distance from the top?

or am i climbing the wrong tree?

teedoff · 05-05-2011, 08:50 PM

The image is set on the body, so no that wont work.

Do you use Firebug? Its free download for firefox browser. Very useful.

Lpmraven · 05-05-2011, 09:03 PM

I got an idea, could I take the background image into photoshop, add the nav bar to the top then i could put the nav back into the wrapping to keep it inline.?

Lpmraven · 05-05-2011, 09:13 PM

Sweetabix. We rock! nice one you guys, high 5¬! ah thanks for that Teed, its a good tool, just downloaded it and it made me think of the solution.

Just a small problem somewhere in the css coding, in my forms and stuff the background is taken from the bg image rather than just white... going looking

Thanks all.