Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 4 of 4
  1. #1
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    rounded corners boxes with image contents

    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 ...
    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 ;
    I uploaded the cell as image so you to see what I mean:
    Here is it
    the image with the barbie doll that is on the bottom - is is possible to be done dinamically with CSS and divs? I know how to make it with tables but not with divs
    Thanks in advance for the help!

  • #2
    Senior Coder timgolding's Avatar
    Join Date
    Aug 2006
    Location
    Southampton
    Posts
    1,519
    Thanks
    114
    Thanked 110 Times in 109 Posts
    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.
    You can not say you know how to do something, until you can teach it to someone else.

  • #3
    New to the CF scene
    Join Date
    Dec 2006
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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?

  • #4
    Senior Coder timgolding's Avatar
    Join Date
    Aug 2006
    Location
    Southampton
    Posts
    1,519
    Thanks
    114
    Thanked 110 Times in 109 Posts
    In that case i am confused as to exaclty what you want. Maybe send me the table based code?
    You can not say you know how to do something, until you can teach it to someone else.


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •