padding and headers

I never quite understood the padding code so I need help from someone who does. Here's the story...

I am using a free template on my blog which I modified. The template has a blog description block below the header and I basically just played with the padding code until it looks somehwhat decent.
But now I want the purplish area to connect with the header picture and I can't get it at all.

On top of that it looks differently in Firefox and IE7.

Can someone help me? This is the Header code (see below) and this is my blog

/* Header
----------------------------------------------- */
#header-wrapper { 
  clear: both; width: 98.9%; margin-top: 1px; background: #FFFFFF  repeat center top; height:318px; border: 5px solid #99C9FF; }
  }
#header .titlewrapper {
  background:#ff0066 url("http://bourgy.com/images/Blogspot Banner 1x.jpg") no-repeat left bottom;
  padding:0 0 0 160px;
  margin:0 0 10px;
  color:#fff;
  width:100%;
  width/* */:/**/auto;
  width:auto;
  }
#header h1 {
  background:url("http://bloggerbuster.com/blogger_templates/amanda_template/bghead.gif") repeat center top;
  margin:0;
  padding:10px 30px 190px;  
  font: $titleFont;
  text-transform:lowercase;
  }
#header h1 a {
  color:#fff;
  text-decoration:none;
  }
.postpage #header h1 {
  padding-top:0;
  background-position:0 -40px;
  }

.clear { clear: both; }

/* Description
----------------------------------------------- */
#header .descriptionwrapper {
  background: #9d1961 url("http://bloggerbuster.com/blogger_templates/amanda_template/bg_desc_top2.gif") no-repeat left top; 
  margin:0 0 6px;
  padding:12px 0 0;
  color: $descColor;
  font-size: 75%;
  border-bottom: 1px solid #ffffff;
  }
#header .description {
  background:url("http://bloggerbuster.com/blogger_templates/amanda_template/bg_desc_bot.gif") no-repeat left bottom;
  margin:0;
  padding:0 0 12px;
  display:block;
  line-height: 1.6em;
  text-transform:uppercase;
  letter-spacing:.1em;
  min-height:12px;
  border-bottom: 1px solid #ffffff;
}

#header .description span {
  display:block;
  padding:0 0 0 160px;
  text-transform:uppercase;
  letter-spacing:.1em;
  min-height:12px;
  }

#navbar-iframe {
  height:0px;visibility:hidden;display:none
}

.postpage #description em {
  font-size:1px;
  line-height:1px;
  color:$descColor;
  visibility:hidden;
  }

Code (markup):