• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1839
  • Last Modified:

borders around multiple tables

i have a webpage im working on with tables.

i cant figure out how to boarder the tables.

while each table has its own cellspacing, cellpadding, and border settings, how do i place a border around them all, enclosing ALL of the below tables with one border ... example below:



--->>  wanting border around all of this below,  starting here in the script  <<---

<table width=100% cellspacing=0 cellpadding=0 border=0 bordercolor=gray>
<tr>
<td width="100%"><font class=peq color=eeeeee><CENTER>Main Heading<CENTER></font></td>
</tr>
</table>

<table width=100% cellspacing=0 cellpadding=0 border=1 bordercolor=gray>
<tr>
<td width="100%"><font class=peq color=eeeeee><CENTER>sub heading<CENTER></font></td>
</tr>
</table>

<table width=100% cellspacing=0 cellpadding=0 border=0>
<tr>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
</tr>
</table>

<table width=100% cellspacing=0 cellpadding=0 border=0>
<tr>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
</tr>
</table>

<table width=100% cellspacing=0 cellpadding=1 border=0>
<tr>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
</tr>
</table>

<table width=100% cellspacing=0 cellpadding=1 border=0>
<tr>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
<td width="20%" valign=top bgcolor="000000"><font class=peq><a href="http://web-site.com/"><center>link text</a></center></font></td>
</tr>
</table>

--->>  wanting boarder around the above, ending here  <<---


took me forever to figure all this out and code it to look like it does, but jsut cant figure this out !

thanks in advance !!!!!!

i love you guys !!!!!!!!
0
sanctify
Asked:
sanctify
  • 2
  • 2
1 Solution
 
DoppyNLCommented:
put a table (or div-block) around all those tables and assign the border you want to that.
0
 
seanpowellCommented:
I would simplify your structure with CSS, and use a div for your border. I'm not sure what you're doing with the peq style, but you can incorporate it easily enough...


<html>
<head>
<title>Table Border</title>
<style type="text/css">
<!--
table      { width:100%; }
td.peq     { background-color:#000000; text-align:center; width:20%; }
td.heading { color:#EEEEEE; text-align:center; width:100%; }
//-->
</style>
</head>
<body>
<div style="border: 1px solid #FF0000;">
<table cellspacing="0" cellpadding="0" border="0" bordercolor="gray">
<tr>
<td class="heading">Main Heading</td>
</tr>
</table>
<table cellspacing="0" cellpadding="0" border="1" bordercolor="gray">
<tr>
<td class="heading">sub heading</td>
</tr>
</table>
<table cellspacing="0" cellpadding="1" border="0">
<tr>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
</tr>
</table>
<table cellspacing="0" cellpadding="1" border="0">
<tr>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
</tr>
</table>
<table cellspacing="0" cellpadding="1" border="0">
<tr>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
</tr>
</table>
<table cellspacing="0" cellpadding="1" border="0">
<tr>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
<td valign=top class="peq"><a href="http://web-site.com/">link text</a></td>
</tr>
</table>
</div>
</body>
</html>
0
 
sanctifyAuthor Commented:
woooho you rock !!!!!!!!!!!!!!!!!!!

the peq is test styling by the way.

i am kinda new to html ...so its slow going ...took long time to get that as it was LOL

THANKS !!!!!!!!!!!!!!!!!!!!!!
0
 
sanctifyAuthor Commented:
test=text ... typo =]
0
 
seanpowellCommented:
No problem - and best of luck!
0

Featured Post

Vote for the Most Valuable Expert

It’s time to recognize experts that go above and beyond with helpful solutions and engagement on site. Choose from the top experts in the Hall of Fame or on the right rail of your favorite topic page. Look for the blue “Nominate” button on their profile to vote.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now