Solved

Place the table inside the table(HTML)

Posted on 2000-04-22
3
182 Views
Last Modified: 2010-04-09
I want tp place the table inside the table without altering the actual size of the data.

the problem is ., when i am placing the table inside the <td> tag, the table is taking it's own width and extra space is allocated., I don't want this to be happen., can i override this?
0
Comment
Question by:kousis
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
3 Comments
 
LVL 3

Accepted Solution

by:
davlun20080 earned 50 total points
ID: 2741073
I am guessing that you mean the cell that is holding the nested table is growing to hold the table.  This can happen when you have set column and/or table widths on the nested table that exceed the width of the cell that is containing it.  When planning your page and layout, consider the data that it will hold, so that you can make sure you allocate enough space to contain it.

If you post your code, I will be glad to take a look.

davlun

0
 

Author Comment

by:kousis
ID: 2741341
This is th code bfore nesting the table..


<html>
<head>
<title> table</title>
</head>
<body>



<table border=1 width=85% height=100%>
<tr><td rowspan=4>1



</td><td colspan=2>
2</td><td rowspan=2>5</td></tr>
<tr><td>7</td><td rowspan=2>8</td></tr>
<tr><td rowspan=2>11</td><td rowspan=2>13</td></tr>
<tr><td>16</td></tr>

</table>
</body>
</html>

This is the code after nesting the table..,


<html>
<head>
<title> table</title>
</head>
<body>



<table border=1 width=85% height=100%>
<tr><td rowspan=4><table><tr><td>
<a href="as.htm">this is example</a></td></tr>
<a href="as.htm">this is example</a></td></tr>
<a href="as.htm">this is example</a></td></tr>
<a href="as.htm">this is example</a></td></tr>
</table>
</td><td colspan=2>
2</td><td rowspan=2>5</td></tr>
<tr><td>7</td><td rowspan=2>8</td></tr>
<tr><td rowspan=2>11</td><td rowspan=2>13</td></tr>
<tr><td>16</td></tr>

</table>
</body>
</html>


0
 
LVL 3

Expert Comment

by:davlun20080
ID: 2741959
I know it is a pain to do sometimes, but you need to set up some column and table widths.  Without them, the browser will determine them for you and than can lead to unpredictable results.

You can either declare them explicitly in the td tag such as <td width="10"> or you can use a spacer row at the top or bottom. Using 800x600 as a target, your the spacer row would be like:
<tr>
  <td><img src="transparent.gif" width=175 height=1></td>
  <td><img src="transparent.gif" width=30 height=1></td>
  <td><img src="transparent.gif" width=595 height=1></td>
<tr>

Then you can put the nested table into the cell with width=595 and it's code would look like:
<table width=595 cellspacing=0 cellpadding=0 border=0>
  <tr>
  <td><img src="transparent.gif" width=180 height=1></td>
  <td><img src="transparent.gif" width=200 height=1></td>
  <td><img src="transparent.gif" width=215 height=1></td>
  </tr>
  <tr>
  ... your table data starts here.

I like to use the spacer rows myself.  The thing to remember in tables is that the largest cell is the one to determine the width in a column and the highest cell determines the height of a row.  Finally unless you specify the width through one of these two methods, the tables will be adjusted by the users browser.

davlun
0

Featured Post

Enroll in June's Course of the Month

June's Course of the Month is now available! Every 10 seconds, a consumer gets hit with ransomware. Refresh your knowledge of ransomware best practices by enrolling in this month's complimentary course for Premium Members, Team Accounts, and Qualified Experts.

Question has a verified solution.

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

This article discusses four methods for overlaying images in a container on a web page
Originally, this post was published on Monitis Blog, you can check it here . Websites are getting bigger and more complicated by the day. Video, images and custom fonts are all great for showcasing your product or service. But the price to pay in…
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

734 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