Just to clarify, the code you've been using is not HTML, is CSS. HTML is the markup that makes up a web page.

It seems you're using your blog's custom header feature. When you have the CSS upgrade, you don't need to use it. Reset it, and use CSS to add it to your blog.

Also, although your header image is 930px wide, there is a "white space" 15px wide... you might want to fix that otherwise the image won't look centered.

Replace your current code with this one:

#header {
padding: 0 0 10px;
}

#pagenav{
margin: 20px 0;
}

#header-image{
background: transparent url(http://awesomedc.files.wordpress.com/2010/05/cropped-logo-for-fb-18.jpg) 0 0 no-repeat;
border: solid 5px #EFEFEF;
height: 198px;
overflow: hidden;
padding: 0;
}

#header-image img {display: none;}

#logo {
background: transparent url('http://awesomedc.files.wordpress.com/2009/12/medium-logo.jpg') -40px 0 no-repeat;;
height:60px;
text-indent:-9999px;
width:260px;
}

If you want to decrease the height of the header, change the 198px value in the "#header-image" selector to one that fits your needs.

The gap between the header and the contents is defined in the "#header" selector. If you want a bigger gap, change "10px" to perhaps "20px" or a value that suits you best.

Also, the logo should now be aligned to the left.

Would you also kindly let me know the html code for moving my red logo "awesome DC" a little bit more to the left so it gets lined up with the banner below it?

Speaking of the banner, do you think there is a way to decrease the Height as well as decreasing the space below the banner like I just did on top of the banner with your code?

Here is my current code for header:

#header {
padding-top:0;
}

#logo {
text-indent:-9999px;
background:url('http://my Logo');
height:60px;
width:260px;
}

thanks

#header {padding-top:0;}

lh

Can anyone tell me how to get ride of the white space above the logo and the menu bar so I can push my page a little bit more up?

Appreciate your input and help.

Thanks
Elias