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 6 of 6

Thread: Rounded Corners

  1. #1
    Regular Coder
    Join Date
    Sep 2007
    Posts
    809
    Thanks
    5
    Thanked 2 Times in 2 Posts

    Question Rounded Corners

    Hi all,

    I have a design which includes an image or 2 (if i split them up) I want this to have a rounded corner effect but i only know how to added a normal border to this image.

    Can anyone advise me how i can create a rounded border for this image?

    Thanks

  • #2
    Senior Coder effpeetee's Avatar
    Join Date
    Feb 2007
    Location
    Clapham Junction - London SW
    Posts
    4,885
    Thanks
    228
    Thanked 204 Times in 203 Posts
    Try this site

    And more here right hand column.

    Frank
    * Sources (updated: 21.11.2012.
    Using Windows 8 Professional. 64bit with HP Photosmart 5510 printer Very useful site here.

  • #3
    Regular Coder
    Join Date
    Sep 2007
    Posts
    809
    Thanks
    5
    Thanked 2 Times in 2 Posts
    Quote Originally Posted by effpeetee View Post
    Try this site

    And more here right hand column.

    Frank
    Thanks the first site is exactly what i was after, although now i need to work out how to lay an image flush against the border.

  • #4
    New to the CF scene
    Join Date
    May 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts
    This is a html table with rounded corners. It is using four small images for corners.

  • #5
    hkp
    hkp is offline
    New Coder
    Join Date
    May 2009
    Posts
    11
    Thanks
    0
    Thanked 1 Time in 1 Post
    you can use that code for this purpose hope this will help you...

    Code:
    <html>
    <head>
    <title>HTML Table with rounded corners</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8869-1">
    </head>
    
    <body bgcolor=#ffffff>
    <h1>HTML Table with rounded corners</h1>
    <table border="0" cellpadding="0" cellspacing="0" width=200 height=200 bgcolor=#eeddcc >
      <tr>
        <td width="6" height="6" style="background: url('top_l.gif'); background-repeat:no-repeat;"></td>
        <td height="6" style="border-top:1px solid #000; font-size:1px; "> &nbsp;  </td>
    
        <td width="6" height="6" style="background: url('top_r.gif'); background-repeat:no-repeat;"></td>
      </tr>
      <tr>
        <td style="border-left:1px solid #000; font-size:1px; "> &nbsp;  </td>
        <td valign=top>
    	This is a table with rounded corners. It uses two small images for top left and right and two for bottom. Download time is very good. because all of them take less than 2kb.
    	
    	</td>
        <td style="border-right:1px solid #000; font-size:1px; "> &nbsp;  </td>
    
      </tr>
      <tr>
        <td width="6" height="6" style="background: url('bottom_l.gif'); background-repeat:no-repeat;"></td>
        <td style="border-bottom:1px solid #000; font-size:1px; "> &nbsp;  </td>
        <td width="6" height="6" style="background: url('bottom_r.gif'); background-repeat:no-repeat;"></td>
      </tr>
    </table>
    </body>
    </html>

  • #6
    Supreme Master coder! abduraooft's Avatar
    Join Date
    Mar 2007
    Location
    N/A
    Posts
    14,859
    Thanks
    160
    Thanked 2,223 Times in 2,210 Posts
    Blog Entries
    1
    The Dream is not what you see in sleep; Dream is the thing which doesn't let you sleep. --(Dr. APJ. Abdul Kalam)


  •  

    Posting Permissions

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