Table inside another table

I had table inside the another table, my inner table display the image, if I enter the text after the inner table, the text should display right side of the table and the bottom of the inner table. How do I do this?

"the below code display the outer table text always displayed below the inner table"

Heading

<table class="">
    <tr style=" width:500px; float:left;">
        <td style="border: thin ridge #008000; text-align:left;" align="left"; >
            <table class="" 
                style=" border: 1px solid #800000; width:200px; float:left; height: 200px;">
                <tr>
                    <td>&nbsp;stackoverflowstackoverflow stackoverflowstackoverflow 
                        stackoverflowstackoverflow stackoverflowstackoverflow&nbsp; </td>
                </tr>
                </table>
            stackoverflow stackoverflowstackoverflow stackoverflowstackoverflow 
            stackoverflowstackoverflow stackoverflowstackoverflow stackoverflowstackoverflow 
            stackoverflowstackoverflow stackoverflowstackov开发者_运维知识库erflow stackoverflowstackoverflow 
            stackoverflowstackoverflow stackoverflowstackoverflow stackoverflowstackoverflow 
            stackoverflowstackoverflow stackoverflowstackoverflow stackoverflowstackoverflow 
            stackoverflowstackoverflow stackoverflowstackoverflow statackoverflow sta</td>
    </tr>
</table>

---

You should be able to add float: left; to the table via CSS. This will accomplish what you are looking for as it will pull the table out of the normal flow of elements and the text should wrap around to the right and bottom like you described.