css challenge: float+ fixed height + fixed background

I hope someone has a solution because right now I am completely lost...
I came up with a nice lay-out for my personal website, but is seems impossible to do with CSS.

this is kind of what I have in mind:

the basics consist of a flexible wrapper with a min and a max width (I conveniently ignore IE6 for now). The left-side div is the content-area and has a flexible width. The center and right div are both float:right and have a fixed width. So far so good, but this is where the problems begin:

I would like to have the center-div to have a fixed height of 100% of the viewport. However, because it is floated the height: 100% is not the height of the screen but the height that is available inside the floated area.

Problem no.2 is the image: I want the image to be fixed to its spot, no-repeat and so on. Background-attachment:fixes fixes the background, but to the viewport and not to the div it is in. So as soon as I set it to fixed it disppears. Guess how many extremely frustrating hours I spend before I remebered that...

I even tried to get this lay-out to work with tables (I was getting desperate) but even then both the height and the fixed won't work. The height because of the flex-width wrapper (which does not want to have height:100% either, even with body height at 100%), and the fixed because of what I mentioned earlier. To be honoust I do not want the wrapper to have a fixed width because I want the scrollbar to work as it would normally do.

my HTML:

(div id="right")
   navigation
(/div)

(div id="center")center, this is the problem-area! (/div)

(div id="left")
Main content area, here I am going to out all the stuff that matters, or that doen't matter
(/div)

(/div)

my CSS

#wrapper         {
   min-width: 700px;
   max-width: 1200px;
   margin: auto;
   text-align: left;
   background-color: #FF9900; // orange
}

#left            {
   margin-right: 280px;
   padding: 10px;
   background-color: #99FF99; // green
}

#center            {
   float: right;
   width: 120px;
   height: 1000px;
   background: #000000 url(img/dionahoofd.png) no-repeat;
}

#right            {
   float: right;
   width:150px;
   padding: 5px;
   background-color: #FFFF66; // yellow
}