Positioning images in the header with CSS

http://www.worldinvestment.org/worldinvestment/

I am trying to write new CSS for the tpl_header.php page. I get the images to show but not the way they are in the CSS. Below is the new css and the URL is http://www.worldinvestment.org/worldinvestment/

#outsideheadercss {
height: 612px;
width: 1584px;
position: relative;
}

#flashmainnav {
height: 612px;
width: 684;
position: absolute;
top: 137px;
}

#topmainnav {
height: 139px;
width: 684px;
position: absolute;
}

#bottommainnav {
height: 136px;
width: 684px;
position: absolute;
}

#contrypicture {
position: absolute;
height: 134px;
width: 157px;
left: 684px;
}

The images are supposed to be beside the ones up top. I have increased the width of the template so that the css reads

#mainWrapper {

background-color: #ffffff;

text-align: left;

width: 1584px;

vertical-align: top;

}

Any help you can give would be great

Thank you
sincerely
Craig

1584px fixed width... wow! Are you expecting everyone who uses your site to have an ultra-widescreen monitor? Or will they be ok with scrolling back and forth? Or what is the purpose of that width?

At any rate, there are some missing bits in your CSS as shown.

#flashmainnav {
height: 612px;
width: 684; <--------add px
position: absolute;
top: 137px;
left: xxxpx; <------add
}

#contrypicture { <-----is this spelled correctly (matching your code tag)?
position: absolute;
height: 134px;
width: 157px;
left: 684px;
top: xxxpx; <------add
}

(Other absolute items need top & left too...)

Once you have those, your images should start to work, and then you can make adjustments as required.

Thank you so much I will check what I wrote with what you wrote. :smile: