Positioning inner table inside cell with text
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:
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.