Css / java / corners

1

Hey guys. i’m working on a site trying to figure out how to give a table curved corners. instead of it being boxy around the sides i want it circular… can somebody please help me out with this… thanks

2

The only way to make curved corners on table borders is by using graphics within the outside rows and columns of the table. The corner cells would each have the appropriate 90° arc that match up with the horizontal and vertical graphics in the outer rows and columns. In order to make the graphics align when the table resizes you need to make the vertical and horizontal graphics cell backgrounds (with a properly sized transparent spacer image within the cells). The corner graphics would go in the cells not as cell backgrounds.

The prior version of my website was set up exactly this way. I took a fair amount of trial and error to figure out what worked. That version has been gone for quite some time, but you can still see a few remnants of it on my eBay “about me” page. I made it look similar and haven’t bothered to change it.
http://members.ebay.com/aboutme/abzoid

3

is there anyway i could IM you or something… ive been working at this all day and i just am not getting anywhere…

4

OK, here’s a section of HTML code. That how I made the ones on my site and the ones still on my eBay page. If you want slimmer borders just make slimmer graphics.

<table width="100%" border="0" cellspacing="0" cellpadding="0">
  <tr> 
    <td><img src="topleft.gif" width="19" height="19"></td>
    <td background="top.gif"><img src="spacer.gif" width="1" height="1"></td>
    <td><img src="topright.gif" width="19" height="19"></td>
  </tr>
  <tr> 
    <td background="left.gif">&nbsp;</td>
    <td> {the viewable content goes here} </td>
    <td background="right.gif">&nbsp;</td>
  </tr>
  <tr> 
    <td><img src="btmleft.gif" width="19" height="19"></td>
    <td background="bottom.gif"><img src="spacer.gif" width="1" height="1"></td>
    <td><img src="btmright.gif" width="19" height="19"></td>
  </tr>
</table>
5

there are a few tutorials out there:

http://www.htmlgoodies.com/tutors/roundcorners.html
http://www.yourhtmlsource.com/tables/roundedcorners.html
http://www.erichockman.com/roundtables.html
http://www.freewebmasterhelp.com/tutorials/corners

maybe they can help you also.

ff