How to Position Some Columns in Table

You have a few problems with this code. First, you should always nest your rows within a table. Second, what you have with value and currency is supposed to be a nested table, but you are trying to reproduce that kind of layout without the proper html. Try using the following template to accomplish your goal. I have tested it and it does produce the exact layout you had asked for.

<table>
    <tr>
        <td colspan="2" style="text-align: center;">
            First Column
        </td>
        <td colspan="2" style="text-align: center;">
            Second Column
        </td>
    </tr>
    <tr>
        <td colspan="2" style="vertical-align:top;text-align: center;">
            Some Text
        </td>
        <td colspan="2">
            <table style="text-align: center; width: 100%">
                <tr>
                    <td>
                        Value
                    </td>
                    <td>
                        Currency
                    </td>
                </tr>
                <tr>
                    <td>
                        100
                    </td>
                    <td>
                        USD
                    </td>
                </tr>
                <tr>
                    <td>
                        3000
                    </td>
                    <td>
                        USD
                    </td>
                </tr>
            </table>
        </td>
    </tr>
</table>

And here is the result (borders added):

no need to force colspans on this table, it looks like it can simply be done with three td's per tr

heres how I rebuilt the table:

<table>
    <tr>
        <td>First column</td>
        <td>Second column</td>
        <td>&nbsp;</td>
    </tr>
    <tr class="empty">
        <td>&nbsp;</td>
        <td>&nbsp;</td>
        <td>&nbsp;</td>
    </tr>
    <tr>
        <td><?php echo 'Price';?>:</td>
        <td style="text-align: right;"><?php echo 'Value';?></td>
        <td style="padding-left:10px;"><?php echo 'Currency';?></td>
    </tr>
    <tr>
        <td style="height:10px;">Some Text</td>
        <td style="text-align: right;"><?php echo $price; ?></td>
        <td style="padding-left:10px;"><?php echo $currency; ?></td>
    </tr>
</table>

To achieve what I think you meant how it should look like, consider this code:

<table>
    <tr>
        <td colspan="4">First Column</td>
        <td colspan="4">Second Column</td>
    </tr>
    <tr>
        <td rowspan="3" colspan="4" style="vertical-align:top;">Some Text</td>
        <td>Value</td><td colspan="3">Currency</td>
    </tr>
    <tr>
        <td>100</td>
        <td colspan="3">USD</td>
    </tr>
    <tr>
        <td>3000</td>
        <td colspan="3">USD</td>
    </tr>
</table>

But I don't see a sense in the colspan="4" on the first and second column. If you remove all the colspan attributes and just add colspan="2" to the row with "second column" it will look the same and be less complicated.

You need to remove <td colspan="2" style="height:10px;">&nbsp;</td> to get the desired results. And instead of using <td colspan='1'> on other columns, use <td colspan='2'> instead.

HTML

<table>
<tr>
   <td colspan="4">
     First column
  </td>
   <td colspan="4">
     Second column
  </td>
</tr>
     <tr class="empty"><td colspan="8">&nbsp;</td></tr>
     <tr>
        <td colspan="4">
           Price
        </td>

        <td colspan='2' style="text-align: right">
            Value
        </td>
        <td style="padding-left:10px" colspan='2' >
            Currency
        </td> 
    </tr>
 <tr>
    <td colspan="4"></td>
    <td colspan="2" style="text-align: right">Price 1</td>
    <td colspan="2" class="pull-right">Currency 1</td>
 </tr>   
 </table> 

Working Fiddle

PS: You don't need to print those static texts using PHP echo

Change from:

<td colspan="4">
  <?php echo 'Price';?>:
</td>

To:

<td colspan="4">
  Price:
</td>