Greetings!

 

I'm trying to achive this:

at this site: arkster.com/links.html

 

It seems any overflow is being cut off.

Is there a way to do this using css background-image, or is there a better way? I feel like the image is styling, not content, which is why I wanted to try and use css and avoid an img tag if possible.

 

Also, the text on this page doesn't even show up on IE 7. Any ideas where I might start to make this at least viewable on IE 7? Thank you for any help you can provide.

To fix the text not displaying in IE 7 I figured out I needed to float the images left because for some reason floating the text right wasn't enough. So I'm still really wondering about how to have the "spider" background-image overflow, but I figured out how to have it display okay in the archaic versions of IE. Thanks!

You can't make the background image change position to suit the div content. You will have to code the image as a normal img src below the text OR give the div a fixed height (make sure it's enough for all text content with a bit of spare height in case someone increases text size).

 

This height works with the text and background image that you have at present:-

#infobox_links {           height: 350px;  
background-color: #E7E7E7;
-moz-border-radius: 10px 0 0 10px;
-webkit-border-radius: 10px 0 0 10px;
-khtml-border-radius: 10px 0 0 10px;
border-radius: 10px 0 0 10px;
width:245px;
float:right;
padding: 5px 10px 60px 34px;
position:relative;
line-height:1.25;
background-image:url('../img/box-footer_links2.png');
background-position: center 250px;
background-repeat:no-repeat;
}