My css and html code?

R

Ralph

New member
Hey guys I was I have several questions that have to do with my html and css code. Is my coding style and format good and if not how can I improve it?, why does my side bar float higher than my content box?, what are some things I did wrong in my html and css coding?, do you know of any links I can use to help with my problem's with my code? I really just what your opinions and information, i consider my self a beginner and I could really use the help.
Here is my internal css 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" />
<title>Test Page</title>
<style type="text/css">
body{background-color:#03F; margin:0px; padding:0px;}
.header_wrap{}
.header{width:100%; background-color:#90C;}
.logo{}
.navigation_wrap{}
.navigation li{display:inline; margin:5px;}
.navigation{width:100%; background-color:red;}
.content_wrap{float:left; width:80%;}
.content{height:auto; background-color:white;}
.content p{margin:10px;}
.sidebar{width:20%; background-color:green; float:right}
.footer{background-color:gray;}
.clearer{clear:both}
</style>
</head>
Here is my html code:
<div class="header_wrap">
<div class="header">
<div class="logo">
<h1>Welcome Test Page</h1>
<p>This page is just a test.</p>
</div>
</div>
</div>
<div class="navigation_wrap">
<div class="navigation">
<ul>
<a href="#"><li>Link</li></a>
<a href="#"><li>Link</li></a>
<a href="#"><li>Link</li></a>
<a href="#"><li>Link</li></a>
</ul>
</div>
</div>
<div class="content_wrap">
<div class="content">
<h3></h3>
<p>This is just a test paragraph, not the real thing.</p>
<h3>Random</h3>
<p>This is just a test paragraph, not the real thing.</p>
<h3>Random</h3>
<p>This is just a test paragraph, not the real thing.</p>
</div>
</div>
<div class="sidebar">
<ul>
<li>List</li>
<li>List</li>
</ul>
<ul>
<li>List</li>
<li>List</li>
</ul>
</div>
<div class="clearer"></div>
<div class="footer">
<p>©All Rights Reserved To Ralph Stone</p>
</div>
<body>
</body>
</html>
This code is just a sample, but pretty much shows how I create most sites with, Like the format.
 
Back
Top