Solved

borders around multiple tables

Posted on 2003-10-29
5
1,831 Views
Last Modified: 2010-04-09
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
Comment
Question by:sanctify
  • 2
  • 2
5 Comments
 
LVL 6

Expert Comment

by:DoppyNL
ID: 9641475
put a table (or div-block) around all those tables and assign the border you want to that.
0
 
LVL 31

Accepted Solution

by:
seanpowell earned 40 total points
ID: 9641547
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
 
LVL 1

Author Comment

by:sanctify
ID: 9641959
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
 
LVL 1

Author Comment

by:sanctify
ID: 9641980
test=text ... typo =]
0
 
LVL 31

Expert Comment

by:seanpowell
ID: 9641983
No problem - and best of luck!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Bootstrap more than 12 columns in row 3 37
Set email body to html using vbscript 6 26
Form Submit falis 6 26
Materializecss - Different Behaviors in Browser's 1 20
Foreword (July, 2015) Since I first wrote this article, years ago, a great many more people have begun using the internet.  They are coming online from every part of the globe, learning, reading, shopping and spending money at an ever-increasing ra…
This article discusses how to create an extensible mechanism for linked drop downs.
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
Video by: Mark
This lesson goes over how to construct ordered and unordered lists and how to create hyperlinks.

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

11 Experts available now in Live!

Get 1:1 Help Now