View Full Version : rounded corners boxes with image contents

Dec 15th, 2006, 09:40 AM
Im very new to rounded corners made by divs and I have to make one resizable cell with rounded corners where the content is image of a lady stepped on the bottom of the cell and the image should be dynamic - is it possible to make such cell where all the 4 corners are rounded and somehow the image content to able to touch the borders of the cells and I have to do this with div s only - no tables I know how to make it with tables never did it with divs ... :confused:
I saw several tutorials of how to make a cell with 4 rounded corners but they all are with tect content in the middle - and this time I have images that hit the sides of the cell something like a bordered cell with rounded corners some image that is located at the bottom :eek: :confused: ;
I uploaded the cell as image so you to see what I mean:
Here is it (http://s15.photobucket.com/albums/a387/PrettyYoungShark/?action=view&current=roundedcorner-02.jpg)
the image with the barbie doll that is on the bottom - is is possible to be done dinamically with CSS and divs?:confused: I know how to make it with tables but not with divs
Thanks in advance for the help!

Dec 15th, 2006, 11:18 AM
The best way to achieve this is to use a 9 individual div element so you get topleft, top, topright, left, middle, right, bottomleft, bottom and bottomright. then you make a background image for each (probably a set of GIFs in this case). The idea being you can use slim 1 px high or wide images that can be repeated. This allows your 'rounded box' to be any size. You could reuse the codes as many times as required for different size boxes therefore.

Dec 15th, 2006, 01:10 PM
thanks but the image should be one of the dynamic content - it should be changed as it is by the client.. is it possible without slicing the legs of the doll?

Dec 15th, 2006, 02:34 PM
In that case i am confused as to exaclty what you want. Maybe send me the table based code?