Forum Moderators: not2easy

Message Too Old, No Replies

Problems with background image in IE

probably the box model issue...

         

SilverLining

2:10 pm on Aug 4, 2006 (gmt 0)

10+ Year Member



I'm having a problem displaying background images correctly in IE. The desired result is to display an image with a background image with rounded corners boxing it in. Once again, unfortunately, I cannot change the XML code (it would be easily resolved by adding a surrounding div).

Here is the code (works perfectly in Firefox):


img.theimage {
width: 160px;
height: 150px;
background:url(blah.gif) no-repeat 0 100%;
padding:10px;
margin: 0px 7px 0px 0px;
float: left;
}

Also, I'm having to scale down the image, therefore have specified width and height on image. Padding pushes it out to display the bg image correctly in Firefox and the right margin is needed to create some space around the image. Ideas?

Setek

3:23 am on Aug 7, 2006 (gmt 0)

10+ Year Member



AFAIK, there's no way to 'scale' a background image with CSS.

It displays as a background, and it displays wherever it's positioned, as it is.

On the other hand, if you set the width and the height of the image, and have the image display as it normally does (using

src
) then it should scale - but not as a background image.

That's all I've got, sorry :)