CSS Background Images

[master maste]

Ok so I'm working on a header for a website and know that only one background image can be placed on an element.

I have 2 images, a 2px wide gradient and a 56px wide corner image (needs the corner image to be in the top right corner).

I figured that to get that to work you would just create 2 divs (1 inside the other) with the gradient on the first one, then the corner on the second one.

#header {
	background: url(images/headerbackground.jpg) repeat-x;
	height: 140px;
}

#header2 {
	position: absolute;
	top: 0;
	right: 0;
	background: url(images/headercorner.jpg) no-repeat top right;
}

any suggestions to get this working? nothing stupidly complicated please.

edit: nvm found the problem, turns out some background colors and an image were interfering with both ofthe background images.