HTML table how to split rows in second column?

Question

And align by center?

In my case I need something like this:

in the place where square is, I want to put picture, aligned in center. I try to do it in table, but I can split only first rows like this:

<div>
    <asp:Panel>

       <table>
        <tr> 
         <td rowspan="2" bgcolor="#FBF0DB">Cell 1</td>
         <td>Cell 2</td>
        </tr>
        <tr> 
         <td>Cell 3</td>
        </tr>
       </table>

    <!-- here other markup -->
    </asp:Panel>
</div>

But if I swap(td from first tr with second), cell from right is not splitted or not aligned by center:

How to split from right side and align by center?

Answer 1

Just do something like this and you'll be fine.

<div>
<asp:Panel>

   <table>
    <tr> 
     <td bgcolor="#FBF0DB">Cell 1</td>
     <td rowspan="2">Cell 2</td>
    </tr>
    <tr> 
     <td >Cell 3</td>
    </tr>
   </table>

<!-- here other markup -->
</asp:Panel>

The principle is simply telling the second column on the first row to occupy two rows in place of the default which is one.