Help with rounded corner width and height

[Norman]

Hi guys. I need another help. I've done this:Code:

<div> <!-- message --> <table cellspacing="0" cellpadding="0" border="0" style="width: auto;"> <tr> <td style="padding: 0px"><img src="images/message/b_01.gif"></td> <td style="padding: 0px" background="images/message/b_02.gif"></td> <td style="padding: 0px"><img src="images/message/b_03.gif"></td> </tr> <tr> <td valign="top" style="padding: 0px" background="images/message/b_04.gif"> <img src="images/message/b_05.gif"></td> <td style="padding: 0px; background-color: #ffffff" bgcolor="#ffffff"> <div id="post_message_$post[postid]">$post[message]</div> </td> <td style="padding: 0px" background="images/message/b_06.gif"></td> </tr> <tr> <td style="padding: 0px"><img src="images/message/b_07.gif"></td> <td style="padding: 0px" background="images/message/b_08.gif"></td> <td style="padding: 0px"><img src="images/message/b_09.gif"></td> </tr> </table> <!-- / message --> </div>

My problem is that I want to set a default width and a default height. If I put somethinglike this:

<div> <!-- message --> <table cellspacing="0" cellpadding="0" border="0" style="width: 100%;"> <tr> <td style="padding: 0px"><img src="images/message/b_01.gif"></td> <td style="padding: 0px" background="images/message/b_02.gif"></td> <td style="padding: 0px"><img src="images/message/b_03.gif"></td> </tr> <tr> <td valign="top" style="padding: 0px" background="images/message/b_04.gif"> <img src="images/message/b_05.gif"></td> <td style="padding: 0px; background-color: #ffffff" bgcolor="#ffffff"> <div id="post_message_$post[postid]">$post[message]</div> </td> <td style="padding: 0px" background="images/message/b_06.gif"></td> </tr> <tr> <td style="padding: 0px"><img src="images/message/b_07.gif"></td> <td style="padding: 0px" background="images/message/b_08.gif"></td> <td style="padding: 0px"><img src="images/message/b_09.gif"></td> </tr> </table> <!-- / message --> </div>

I get this error:How do I fix it? I want a default width and a default height (that it could change, depending on the text lenght)..

[justsomeguy]

You need to have a fixed size for all of the cells that include the border images. The borders on the left should all have a specific width, the borders on the right should all have a specific width, and the borders on top and bottom should tile horizontalls but still have a specific height. You also want the left and right borders to tile vertically, so you might need to move the pointer graphic from the middle left to the upper left so that the middle can tile.

[Norman]

Mhh, could you please adjust that code for me? You know, I understand a little, but if I have to put your reply into code.. it's a problem for me! Can you please help me, justsomeguy?

[kgun]

There is an Italian site below.This is about Web 2.0 design. Googlespanky corners Alex Walker site:http://www.sitepoint.comMore precisely thishttp://www.sitepoint.com/blogs/2006/05/02/...-no-javascript/SitePoint is the best source I know of since all of the solutions listed below (including the Italian) have drawbacks.Links: http://www.alistapart.com/articles/customcorners/http://www.alistapart.com/articles/customcorners2/http://www.vertexwerks.com/tests/sidebox/Inspirations for the above see:http://www.alistapart.com/articles/slidingdoors/http://www.alistapart.com/articles/slidingdoors2/Other solutions:http://www.html.it/articoli/nifty/index.html or Google nifty corners site:http://www.html.ithttp://www.spiffycorners.com/

[Norman]

I know most of those techniques.. but I would like to use the one I've wrote in my first post.. I don't know, but if that's ok, why not?

[Norman]

Great! I've solved using this code:

<div align="center"><!-- message --><table cellspacing="0" cellpadding="0" border="0" style="width: auto;"><tr><td style="padding: 0px"><img src="images/message/b_01.gif"></td><td style="padding: 0px" background="images/message/b_02.gif" width="100%"></td><td style="padding: 0px"><img src="images/message/b_03.gif"></td></tr><tr><td valign="top" style="padding: 0px" background="images/message/b_04.gif"><img src="images/message/b_05.gif"></td><td style="padding: 0px; background-color: #ffffff" bgcolor="#ffffff"><div id="post_message_$post[postid]">$post[message]</div><br /></td><td style="padding: 0px; height: 80px;" background="images/message/b_06.gif"></td></tr><tr><td style="padding: 0px"><img src="images/message/b_07.gif"></td><td style="padding: 0px" background="images/message/b_08.gif" width="100%"></td><td style="padding: 0px"><img src="images/message/b_09.gif"></td></tr></table><!-- / message --></div>

:)Thank you for your posts!