Jump to content


 


Register a free account to unlock additional features at BleepingComputer.com
Welcome to BleepingComputer, a free community where people like yourself come together to discuss and learn how to use their computers. Using the site is easy and fun. As a guest, you can browse and view the various discussions in the forums, but can not create a new topic or reply to an existing one unless you are logged in. Other benefits of registering an account are subscribing to topics and forums, creating a blog, and having no ads shown anywhere on the site.


Click here to Register a free account now! or read our Welcome Guide to learn how to use this site.

Photo

Nesting Tables


  • Please log in to reply
3 replies to this topic

#1 merthyrblue

merthyrblue

  • Members
  • 74 posts
  • OFFLINE
  •  
  • Local time:08:37 PM

Posted 07 January 2008 - 11:04 AM

Could someone please have a look at the HTML code below and tell me why the "contents" is pushing up into the "site navigation". Thanks in advance for any and all help! MB

<html>
<head>

<title>Nesting Tables</title>

</head>
<body>

<!-- container -->
<table width="600" cellspacing="2" border="1" align="center">
<tr><td>


<!-- table 1 -->
<table width="150" height="100" cellspacing="2" cellpadding="2" align="left" border="1">
<tr>
<td rowspan="2" align="center"><u>External Links</u></td>
</tr>
</table>

<!-- table 2 -->
<table width="450" height="30" cellspacing="2" cellpadding="2" align="right" border="1">
<tr>
<td align="center"><u>Site Navigation</u></td>
</tr>
</table>

<!-- table 3 -->
<table width="450" height="70" cellspacing="2" cellpadding="2" align="right" border="1">
<tr>
<td align="center"><u>Contents</u></td>
</tr>
</table>

</td></tr>
</table>

</body>
</html>

BC AdBot (Login to Remove)

 


#2 groovicus

groovicus

  • Security Colleague
  • 9,963 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:Centerville, SD
  • Local time:02:37 PM

Posted 07 January 2008 - 11:49 AM

A couple of things; it would be helpful to know what sort of browser you are using, so that anybody else that is inclined to look can recreate what you are seeing. I use Firefox, and what I see may not be what you see. Also, indenting code makes it much easier to read and identify potential problems, and then using code tags to display it here so that the formatting is preserved. :thumbsup:

As far as things being scrunched, your problem is in your addition. You define an interior table with a width of 450 px, then you declare cellspacing of 2px, and a border of 1 px. The actual size of that table is then 456 px. The same problem exists with your other tables. They are not 150px, but rather 156px.

156 + 456 =612. That's bigger than 600 px (which you declared for the size of the enclosing table), and so will not fit properly inside your outer table.

#3 merthyrblue

merthyrblue
  • Topic Starter

  • Members
  • 74 posts
  • OFFLINE
  •  
  • Local time:08:37 PM

Posted 07 January 2008 - 01:16 PM

Hi Groovicus
I was using Notepad and IE7 to build the nested tables. After taking onboard your suggestions the nested tables now displays exactly as i would want them to when viewed through Firefox. Unfortunately the old problem still persists in that the contents is still pushing up into the site navigation when viewed through IE7?

#4 groovicus

groovicus

  • Security Colleague
  • 9,963 posts
  • OFFLINE
  •  
  • Gender:Male
  • Location:Centerville, SD
  • Local time:02:37 PM

Posted 07 January 2008 - 02:08 PM

IE may be adding some extra padding or margin. I am not on a Window's system at the moment, so I can not check, but try increasing the size of the outer table to 650 or something just to see what happens. Alternatively, remove the size constraint from the outer table all together. In Firefox, the table will only be as large as it nees to be to contain the interior elements; not sure what IE does.

EDIT: JUst had a chance to look at it in IE...now I see what you are talking about. I would have to take a closer look.




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users