table inside a table

@ShaolinDragonAug 31.2005

I’m kind of getting crazy with this…. What i pretend is that the table inside the main table be lined up at the top. Every time i add one row in this table the distance to the last line increases. I think i already have tried in a million ways and stil can’t have no solution to this. Thanks for your help folks ?

<HTML>

<tr> <td colspan =”4″ width=”50%” align=”left”> <a href=”D:webinfohomepage.html” name=”topo”><img src=”..piclogo.gif” border=”0″></a> </td> <td colspan =”4″ width=”50%”align=”right”> Feedback / Report Broken Link </td> </tr>

<!–Cabeçalho da tabela–> <tr> <td> </td> </tr>

<tr border=”0″ > <td colspan=”8″ width=”100%” align=”center”> Links </td> </tr>

<!–1º Bloco – Modelo–>

<tr border=”0″ > <td colspan=”8″ width=”100%” align=”center”> <a href=”#latitude”>Latitude</a> </td> </tr>

<tr><td colspan=”8″> </td></tr>

<tr> <td colspan=”8″ width=”100%” align=”center”> Latitude </td> </tr>

<tr> <td colspan=”8″ width=”100%” align=”center”> Latitude </td> </tr>

<tr><td colspan=”8″ width=”100%”> <table border=”1″> <tr><a name=”latitude”></a> <td width=”6%” align=”center” border=”1″>Modelo</td>&nbsp <td width=”10%” align=”center”>Codename</td> <td width=”5%” align=”center”>Geral</td> <td width=”18%” align=”center”>Teardown</td>&nbsp <td width=”20%” align=”center”>Bios</td> <td width=”14%” align=”center”>Product Overview</td>&nbsp <td width=”18%” align=”center”>Printer Friendly Format</td>&nbsp <td width=”9%” align=”center”>PSQN’s</td>&nbsp </tr> <tr> <td width=”6%” align=”center”>100L</td>&nbsp <td width=”10%” align=”center”>Java</td>&nbsp <td width=”5%” align=”center”>Geral</td>&nbsp

<td width=”18%” align=”center”>Chassis (TearDown Not Available)</td>
<td width=”20%” align=”center”>Bios Simulation</td>&nbsp
<td width=”14%” align=”center”>Product Overview</td>
<td width=”18%” align=”center”>Printer Friendly Format</td>&nbsp
<td width=”9%” align=”center”>PSQN’s</td>&nbsp
</tr>
</table>
</td></tr>
</table>
</BODY>

</HTML>

to post a comment

HTML

15 Comments(s) _↴

@BozeboAug 31.2005 — #I honestly have no idea, just re write the whole thing and maby it will fix itself or there was a mistake noone noticed.....

@ShaolinDragonauthorAug 31.2005 — #already made that about 10 to 15 times with different kind of combinations... At this point the more rows i put inside the inner table bigger it gets the distance to the last line... :

@ray326Sep 01.2005 — #Suggestion #1 is to fix your HTML syntax, e.g. the following is quite invalid.

[code=html]
 <tr><a name="latitude"></a>
 <td width="6%" align="center" border="1"><font size="3" face="Verdana" color="blue"><b>Modelo</b></font></td>&nbsp[/code]

@c0demast3rSep 01.2005 — #Okay, with the information you provided, I was able to correct your errors. The issue was with your syntax. You had several   after your <td>'s, which these are what caused your problem with aall the spaces. I alos corrected your problems with the link to the "latitude" section.

Here is the source code which has been edited and corrected. Please note however, I have not completely debugged the codde, but rather fixed the errors only. Again, this is the best I was able to do with the information you provided.

-----------------------------------------------------------------------------------

<HTML>

<HEAD>

<TITLE>

KB

</TITLE>

</HEAD>

<BODY>

<table width="100%" border="1" align="center">

<tr>

<td colspan="2" width="50%" align="left">

<a href="D:webinfohomepage.html" name="topo"><img src="..piclogo.gif" border="0"></a>

</td>

<td colspan="6" width="50%"align="right">

Feedback / Report Broken Link

</td>

</tr>



<tr border="0">

<td colspan="8" width="100%" align="center">

Links 

</td>

</tr>



<tr border="0">

<td colspan="8" width="100%" align="center"> 

<a href="#latitude">Latitude</a> 

</td>

</tr>

<tr><td colspan="8" border="0"> </td></tr>

<tr>

<td colspan="8" width="100%" align="center">

Latitude 

</td>

</tr>

<tr>

<td colspan="8" width="100%" align="center">

Latitude

</td>

</tr>

<tr><td colspan="8" width="100%">

<a name="latitude" id="latitude"></a>

<table border="1"><tr>

<td width="6%" align="center" border="1">Modelo</td>

<td width="10%" align="center">Codename</td>

<td width="5%" align="center">Geral</td>

<td width="18%" align="center">Teardown</td>

<td width="20%" align="center">Bios</td>

<td width="14%" align="center">Product Overview</td>

<td width="18%" align="center">Printer Friendly Format</td>

<td width="9%" align="center">PSQN's</td>

</tr>

<tr>

<td width="6%" align="center">100L</td>

<td width="10%" align="center">Java</td>

<td width="5%" align="center">Geral</td>

<td width="18%" align="center">Chassis (TearDown Not Available)</td>

<td width="20%" align="center">Bios Simulation</td>

<td width="14%" align="center">Product Overview</td>

<td width="18%" align="center">Printer Friendly Format</td>

<td width="9%" align="center">PSQN's</td>

</tr>

</table>

</td></tr>

</table>

</BODY>

</HTML>

-----------------------------------------------------------------------------------

@ShaolinDragonauthorSep 01.2005 — #Perfect, solved my problem, a million thanks, but now two others doubts rose to me from the code that you've placed in here.

1)Why do you use, for example, on the font size "+3" instead of "5"?

2)Why did you to put the attribute id="latitude" in the tag <a name="latitude">?

Thanks for the reply ?

@c0demast3rSep 01.2005 — #having a name attribute only works, but by web standards, the id makes it more standard for web. As for your , a simple 3 is not correct syntax. if you want just a number, you have to have a (for points of course, not just a 3). Again, this is to keep up with standards.

@JPnycSep 01.2005 — #Actually if you want to keep up with the standards there shouldn't be any font tags at all. That tag was deprecated 4 yrs ago, I think.

@ShaolinDragonauthorSep 01.2005 — #So, if to keep up with the standards the font tags shouldn't be used at all, what should be used?

Can you guys also point me up where can i find the current standards?

@the_treeSep 01.2005 — #So, if to keep up with the standards the font tags shouldn't be used at all, what should be used?[/QUOTE]Meaningful markup that describes the conent it is surrounding.
Can you guys also point me up where can i find the current standards?[/QUOTE][url=http://w3.org]the w3c[/url]

@ShaolinDragonauthorSep 01.2005 — #I know that i'm being kind of a pain, but... i think that i didn't quite understand what you mean by Meaningful markup that describes the conent it is surrounding.[/QUOTE]

Can you give me an example of it? Thanks ?

@the_treeSep 01.2005 — #Can you give me an example of it? Thanks ?[/QUOTE]Rather than this particuarly terrible example:

[code=html]<table bgcolor="#000000" width="100%">
 <tr>
 <td><center><b><font color="#ff00ff" size=+5><br>Page<br>&nbsp;</font></b></center></td>
 </tr>
 </table>[/code]

The following is a lot more descriptive, as it shows that the content is a top level header.

[code=html]<h1 style="background-color: #000; width: 100%; padding: 1em; color: #f0f; text-align: center; font-size: 3em;">
 Page
 </h1>[/code]

Note how all the presentational infomation is kept in the style attribute, but it doesn't even have to be there, a stylesheet can affect the h1 tag without [i]any[/i] presentational markup.

@JPnycSep 01.2005 — #What he means is you can have something like this in the head of the doc, far away from the HTML which is actually displayed on the page:

<style type="text/css">

h1 { style rules for the h1 tag go here }

</style>

And it will style all the h1 tags on your page with whatever you set between the { }

@the_treeSep 01.2005 — #Yeh, the "style rules" are as I put in the style attribute (I put them there to keep the example short).

Here's an idea of how your page could be better coded:

[code=html]<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
 "http://www.w3.org/TR/html4/strict.dtd">
 <html>
 <head>
 <title>KB</title>
 <style type="text/css">
 <!--
 body{
 font-family: verdana, sans;
 text-align: center;
 }
 a img{border: 0;}
 p.sidenote{float: right;}
 h2{clear: both; color: #00f;}
 
 table{
 font-size: 0.8em;
 border-colapse: collapse;
 }
 th{color: #00f;}
 td,th{
 margin: 0;
 width: 12%;
 text-align: center;
 padding: 3px;
 border: 1px solid #eee;
 }
 -->
 </style>
 
 </head>
 <body>
 <h1>
 <a href="D:webinfohomepage.html" name="topo"><img src="..piclogo.gif" alt="K B"></a>
 </h1>
 <p class="sidenote">
 <a href="#">Feedback</a> / <a href="#">Report Broken Link</a>
 </p>
 
 <h2>Links</h2>
 <p>
 <a href="#latitude">Latitude</a>
 </p>
 
 <h2 id="latitude">Latitude</h2>
 <p>Latitude</p>
 <table>
 <tr>
 <th>Modelo</th>
 <th>Codename</th>
 <th>Geral</th>
 <th>Teardown</th>
 <th>Bios</th>
 <th>Product Overview</th>
 <th>Printer Friendly Format</th>
 <th>PSQN's</th>
 </tr>
 <tr>
 <td>100L</td>
 <td>Java</td>
 <td>Geral</td>
 <td>Chassis (TearDown Not Available)</td>
 <td>Bios Simulation</td>
 <td>Product Overview</td>
 <td>Printer Friendly Format</td>
 <td>PSQN's</td>
 </tr>
 </table>
 </body>
 </html>[/code]

Although all that CSS (cascading style sheets) can be put into an external file, with a .css extention wich you can assosiate your page with it by putting this simple line into the head of your page.[code=html]<link href="style.css" rel="stylesheet" type="text/css">[/code](Obviously changing [i]style.css[/i] to your css file.) This is great because it means that you can change the presentation of all your pages in one go (by editing the style sheet) and also your visitors will only download the presentional infomation once and thier browsers will cache it.

@ShaolinDragonauthorSep 01.2005 — #Thanks for the great tips guys ? I think right now i have some material to study regarding develloping in HTML ? Once again thanks ?

@c0demast3rSep 01.2005 — #[URL=http://www.w3.org/]W3C - World Wibe Web Consortium[/URL]

[URL=http://www.w3schools.com/]W3Schools - Tutorials[/URL]

Yeah, your html was alot to try and sift through because it was so old. I did the best I could trying to sift through 4+ year old tags. But W3Schools has some good tutorials, and of course Google will help you find more tutorials.

And most definately, something that would clean up your code and make things easier on you would be to use CSS.

Also in #HTML _↴

Locate file in a different directory what does label tag do ?Link to open specific application

Success!

Help @ShaolinDragon spread the word by sharing this article on Twitter...

Tweet This

table inside a table

15 Comments(s) _↴

Also in #HTML _↴

Success!

Social

Version

table inside a table

15 Comments(s) ↴

Also in #HTML ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

15 Comments(s) _↴

Also in #HTML _↴