Relative width - Problem with background and front picture/logo (Partly solved)

[Heidi]

On my site: http://ffohedmark.no I have adapted the Andreas 1 theme to relative width.
Most of it works fine, but I have two problems:

1. My front picture needs to have relative size without distortion, which does not work in IE.
This will be worked around by repeating the bacground picture, and placing logo and text on top.
My problem is:
I can't figure out how to repeat my front image, and get rid of the "white box" to the right.

Template:

 

Stylesheet:

Screen layout: */

body {
margin: 0 auto;
padding: 0;
font: 76% Verdana,Tahoma,Arial,sans-serif;
background: #f4f4f4 url(uploads/FFO/bg.gif) top center repeat-y;
background-image:url(uploads/FFO/logobak.jpg);
background-repeat:repeat-x;
}

#wrap {
background: #ffffff;
color: #303030;
margin: 0 auto;
width: 90%;
}
(etc.)

2. On pages where there is more text in the center coloumn than in the left coloumn, the margin in the center coloumn moves left as seen here: http://www.ffohedmark.no/index.php/news/17/13/ Is there a fix?

[RonnyK]

Heidi,

what about using a "min-width" for your wrap and than assigning percentages to the columns. I don't think that the space will be taken by the center column then.

Ronny

[Heidi]

Thank you RonnyK. I'll give it a try.

[Heidi]

I've got rid of the "white box" by changing my teplate from

this

 

To this:

-->  Full likestilling og deltakelse for funksjonshemmede

FFO Hedmarks hovedmål
Funksjonshemmedes Fellesorganisasjon Hedmark

Frontphoto is hidden, since both "logo-2.jpg" (or any other graphics file) is placed below "logobak.jpg" together with the text.
How do I place these on top of "logobak2.jpg"?

[Utter]

You need to create the actual logo as an image 'sans-background' with transparency and with a matte that's similar to the most common colour in the background block. The background image is added to the div background with 'background-image: url(images/whateveryourbackgroundimagenameis);' and the logo is added to the div via the html.

[RonnyK]

Heidi,

as utter is stating, by including a new div in your header area you can put the image over there while the original div keeps the full color.
I have my header like:

div header
  div left
  /div
  div right
  /div
/div

The css for the header holds the background color, while left holds the logo, the right one I use for some text (address), By using the different divs, the background-color for the header-area fills all.

Ronny