Lining up title text

[clawbog]

I want to line up the title in the header to the navigation bar like this site has, http://blogofthenet.com/. Can anyone help me?

EDIT: I managed to line up the title. But I can't figure out a way to line up the navigation buttons.

Heres current look. http://blogofthenet.com/test/.

* { padding: 0; margin: 0; }

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	}
	
#wrapper { 
	margin: 0 auto;
	width: 922px;
	}
	
#header {
	color: #333;
	width: 100%;
	float: left;
	padding: 10px;
	height: 100px;
	margin: 0px 0px 0px 0px;
	background-color:#F3F2ED;
	background:#282923;
	font-style:italic;
	}
	
#header h1 {
	font-size: 2.0em;
	}
	
#header h1, #header h2 {
	display: block;
	width: 922px;
	margin: 0em auto;
	padding: 20px 0em 20px 0px;
	}
	
#header h1 a {
	color: #fff;
	text-decoration: none;
}
	
#navigation {
	float: left;
	width: 100%;
	color: #333;
	padding: 10px;
	margin: 0px 0px 0px 0px;
	background-color:#000;
	display: block;
	}
	
#leftcolumn { 
	color: #333;
	margin: 0px 0px 0px 0px;
	padding: 10px;
	height: 350px;
	width: 678px;
	float: left;
	background:#232323;
	}
	
#rightcolumn { 
	float: right;
	color: #333;
	margin: 0px 0px 0px 0px;
	padding: 10px;
	height: 350px;
	width: 200px;
	display: inline;
	background:#232323;
	}
	
#footer { 
 	width: 100%;
 	clear: both;
	color: #333;
	border: 1px solid #ccc;
	background-color:#F3F2ED;
 	margin: 0px 0px 10px 0px;
 	padding: 10px;
	}

#navigation {
	float:left;
	width:100%;
	background:#000;
	font-size:93%;
	line-height:normal;
	}

#navigation ul {
	margin: 0;
	padding: 0px 5px 0 124px;
	list-style: none;
	display: block;
	}
#navigation span {
	display: block;
	margin: 0em auto;
	padding: 20px 0em 20px 0px;
	}
#navigation li {
	display:inline;
	margin:0;
	}

#navigation a {
	float:left;
	background:url("images/tableft.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
	}

#navigation a span {
	float:left;
	display:block;
	background:url("images/tabright.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#FFF;
	}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#navigation a span {float:none;}

/* End IE5-Mac hack */
#navigation a:hover span {
	color:#FFF;
	}

#navigation a:hover {
	background-position:0% -42px;
	}

#navigation a:hover span {
	background-position:100% -42px;
	}

[tom-knox]

Can you give us a context and a link to what you've got in action atm?

[clawbog]

Heres what I have so far.
http://blogofthenet.com/test/

Can't figure out how to line up navigation buttons.

* { padding: 0; margin: 0; }

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	}
	
#wrapper { 
	margin: 0 auto;
	width: 922px;
	}
	
#header {
	color: #333;
	width: 100%;
	float: left;
	padding: 10px;
	height: 100px;
	margin: 0px 0px 0px 0px;
	background-color:#F3F2ED;
	background:#282923;
	font-style:italic;
	}
	
#header h1 {
	font-size: 2.0em;
	}
	
#header h1, #header h2 {
	display: block;
	width: 922px;
	margin: 0em auto;
	padding: 20px 0em 20px 0px;
	}
	
#header h1 a {
	color: #fff;
	text-decoration: none;
}
	
#navigation {
	float: left;
	width: 100%;
	color: #333;
	padding: 10px;
	margin: 0px 0px 0px 0px;
	background-color:#000;
	display: block;
	}
	
#leftcolumn { 
	color: #333;
	margin: 0px 0px 0px 0px;
	padding: 10px;
	height: 350px;
	width: 678px;
	float: left;
	background:#232323;
	}
	
#rightcolumn { 
	float: right;
	color: #333;
	margin: 0px 0px 0px 0px;
	padding: 10px;
	height: 350px;
	width: 200px;
	display: inline;
	background:#232323;
	}
	
#footer { 
 	width: 100%;
 	clear: both;
	color: #333;
	border: 1px solid #ccc;
	background-color:#F3F2ED;
 	margin: 0px 0px 10px 0px;
 	padding: 10px;
	}

#navigation {
	float:left;
	width:100%;
	background:#000;
	font-size:93%;
	line-height:normal;
	}

#navigation ul {
	margin: 0;
	padding: 0px 5px 0 124px;
	list-style: none;
	display: block;
	}
#navigation span {
	display: block;
	margin: 0em auto;
	padding: 20px 0em 20px 0px;
	}
#navigation li {
	display:inline;
	margin:0;
	}

#navigation a {
	float:left;
	background:url("images/tableft.gif") no-repeat left top;
	margin:0;
	padding:0 0 0 4px;
	text-decoration:none;
	}

#navigation a span {
	float:left;
	display:block;
	background:url("images/tabright.gif") no-repeat right top;
	padding:5px 15px 4px 6px;
	color:#FFF;
	}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#navigation a span {float:none;}

/* End IE5-Mac hack */
#navigation a:hover span {
	color:#FFF;
	}

#navigation a:hover {
	background-position:0% -42px;
	}

#navigation a:hover span {
	background-position:100% -42px;
	}

[berry120]

Have a look at:

http://www.dynamicdrive.com/style/la...d-fixed-fixed/

(view the source, css is there in plain sight.)

Should give you an idea of how to do a layout with headings / columns which is what you're after

[clawbog]

Thanks, i got it how i need it.