Positioning inner table inside cell with text
 

Hello,

I'm a newbie programmer. I'm hoping for some advice on complex html tables, please.

I wish to enclose an html table in such a way that it is positioned to the bottom and to the right of its enclosing element. I would imagine that this enclosing element should be a table cell (itself held inside a table). I also want the enclosing element to have some text in the upper left corner, where space has been left as a result of the inner table positioning. Like this image:

http://i45.tinypic.com/16tb1j.jpg

In the .css file I have the inner table's margins on the left and top set to a value. I also have the enclosing cell's padding on the top and left set to a value. It seems to work fine when I have no text. However, when I add the text to the top left, the inner table is pushed down and extends beyond the lower boundary of the enclosing cell. This effect varies across browsers.

Is there a way to add this text to the cell and retain the correct layout? Do I need to rethink my structure?

Any advice appreciated.

Using nested tables? Err... there might be something wrong with your approach. Have a look at http://www.hotdesign.com/seybold/. Please post your current code and we may give you an alternative way.

Thanks for the reply.

This use of nested tables is quite specific and is the best solution to my problem based on what I know. I have some html files containing descriptions of text commands for a desktop application. Each command has a number of optional parameters and modifiers and is described using a special notation. The idea is to construct tables (or things that look like tables) to describe each command so that users can understand them more easily. A script creates each of these tables dynamically based on each command on every html page, and appends them to each page.

I'll create some code samples and post them.

I have created a JSFiddle (containing only HTML and CSS) which shows my approach to the problem so far:

http://jsfiddle.net/naldenvb/jC8MQ/1/

As you can see, the second cell in the master table contains an inner table. What I would like to be able to do is to resize this inner table (or maybe modify its enclosing cell) so that only the top and left strip of the enclosing cell is shown. The enclosing cell's text should remain, and the inner table should stay inside the enclosing cell as the picture in my original post shows.

Is there a way of doing this?

Thanks