Serious Issues With Spanning My Background With Css

[baby jai]

Ok this has become EXTREMLY annoying, im trying to work with some css with a several column used to be table, here is the css

.catleft	{
	width: 18px;
	height: 27px;
	float: left;
	background: url({style_images_url}/Cat-Left.png) no-repeat;
}	

.catbody	{
	height: 27px;
	float: left;
	background: url({style_images_url}/Cat-BG.png) repeat-x;
}	

.catright	{
	width: 17px;
	height: 27px;
	float: left;
	background: url({style_images_url}/Cat-Right.png) no-repeat;
}	

.catrightbg	{
	height: 27px;
	background: url({style_images_url}/Cat-RightBG.png) repeat-x;
	}

.catrightend {
	width: 113px;
	height: 27px;
	float: right;
	background: url({style_images_url}/Cat-RightEnd.png) no-repeat;
}

.catborders {
	border: 1px solid #b0b0b0;
	border-bottom: 0px;
	border-top: 0px;
}

.powerboxbg {
	border: 1px solid #b0b0b0;
	border-bottom: 0px;
	border-top: 0px;
	background: #f5f5f5 url({style_images_url}/powerleft.png) no-repeat left;
	height: 34px;
	padding: 0px;
	margin: 0px;
}

.catbottomleft {
	width: 21px;
	height: 27px;
	float: left;
	background: url({style_images_url}/Cat-BottomLeft.png) no-repeat;
}	

.catbottombg {
	height: 27px;
	width: 100%;
	background: url({style_images_url}/Cat-BottomBg.png) repeat-x;
}	

.catbottomright {
	width: 21px;
	height: 27px;
	float: right;
	background: url({style_images_url}/Cat-BottomRight.png) no-repeat;
}	

.special {
	font-size: 10px;
	float: right;
	font-weight: bold;
}

.powerboxtitle {
	float: left;
	color: #878787;
	font-weight: bold;
}

.wrapper {
	width: 100%;
	float: left;
}

now the catrightbg is SUPPOSED to span 100%, if i set it to that 100% it messes up the whole div, what am i uspposed to do

[baby jai]

ok i got this to span in chrome and in ff, HOWEVER in IE this doesnt show

.catrightbg	{
	height: 27px;
	display: block;
	background: url({style_images_url}/Cat-RightBG.png) repeat-x 50%;
	}

[baby jai]

can i please get some assistance on this

[ko ko]

What is your HTML?