Table Layout.

liunx

Guest
Hi...<br />
<br />
Most sites are designed using tables. I just want to know how the edges of tables are rounded? Is it because it's a table within a graphic? What Graphic Editor is good for web development? Freeware??? Thank You.<!--content-->Hmm...not quite sure I know what you're talking about.<br />
I've have never seen a table with rounded edges. You would surely have to use a graphic, though. <br />
<br />
Could you give us an example of what you are talking about?<!--content-->A table is just something that you put information in - text, pictures, etc. In fact, you are looking at one right now - see the grey lines around this post? There is no way to make a table not in a box - there are no rounded edges or circular tables in HTML. You can change the properties of the table though. Things such as the cellpadding, cellspacing and border size. Many sites (including this one) have tables that aren't visible - there just isn't any border.<br />
<br />
About image creation - you aren't going to find much quality shareware or freeware. I would invest around $85 and by Jasc PaintShop Pro personally.<br />
<br />
By the way, I see that this is your first post. Welcome to the greatest HTML question and answer place on the internet.<br />
<br />
Have a good day!<!--content-->Basically what those pages with the curved edges are doing is displaying bits of a picture in cells in a table to create a whole. The simplist form is a table with 9 cells (a bit like a tic tac toe grid). In essence the coding goes like this:<br />
<br />
<html><br />
<br />
<body bgcolor="black"><br />
<br />
<table width="?" height="?" border="0" cellpadding="0" cellspacing="0"><br />
<br />
<tr><br />
<td background="top_left_curve.gif"> </td> <!-- That's the top left cell of the table --><br />
<td background="top_straight_bit.gif"> </td> <!-- That's the top middle cell --><br />
<td background="top_right_curve.gif"> </td> <!-- Obviously that makes this the top right cell of the table --><br />
</tr> <!-- That's the top row done --><br />
<br />
<tr><br />
<td background="left_side_bit.gif"> </td><br />
<td bgcolor="white">content content content and more content</td> <!-- The middle of the grid --><br />
<td background="right_side_bit.gif"> </td><br />
</tr> <!-- That's the middle row of the table all done. Can you guess the next bit? --><br />
<br />
<tr><br />
<td background="bottom_left_curve.gif"> </td><br />
<td background="bottom_straight_bit.gif"> </td><br />
<td background="bottom_right_curve.gif"> </td><br />
</tr> <!-- Yep, you got it, that was the bottom row--><br />
<br />
</table><br />
<br />
</body><br />
<br />
</html><br />
<br />
<br />
Obviously you have to play with things like widths and heights of the various rows and cells the like, and possibly use a small transparent gif as a spacer instead of the spaces between the td tags, but that's just a very very quick run through on how it's done.<br />
<br />
Hope that's what you meant and that it helps.<br />
<br />
As far as image editing software goes, I couldn't agree more with Prodeveloping - PaintShopPro is without doubt the best value out there. It only does slightly less than Photoshop for about 1/6th the price and what Photoshop does that PSP doesn't you need to be a great graphic designer to figure out. Once you lash out the $ for PSP you'll find endless fun with it.<br />
<br />
Anyway, as I said I hope that's what you were after.<br />
<br />
Neil<!--content-->info:<br />
<!-- m --><a class="postlink" href="http://www.webmasterbase.com/article.php?aid=392">http://www.webmasterbase.com/article.php?aid=392</a><!-- m --><!--content-->Or you can do it that way, which is certainly a damn-sight better explanation than mine. :D<br />
<br />
Neil<!--content-->Thanks all for your replies.<br />
I now understand how to create those rounded corners.<br />
I kinda knew you couldn't do that using HTML. Thanks Again.<!--content-->
 
Back
Top