css - Replace table with td and tr with div

Question

I have the following table structure

 <table style="width:100%">
                        <tr style="height:20px">
                            <td style="width:10;"></td>
                            <td style="width:20;"></td>
                            <td style="width:5%;"></td>
                            <td style="width:50%;"></td>
                        </tr>
                    </table>

I need to replace the above structure with div's. What is the best way to achieve it using CSS and DIV's only . I don't want to use Tables or td or tr tag's.

Answer 1

    <style>
    .left{float:left;}
    </style>    
    <div style="width: 100%;">
    <div class="left" style="width: 50%;">1</div>
<div class="left" style="width: 50%;">2</div>
    <!--Next "Row"-->
    <div class="left" style="width: 50%;">1</div>
<div class="left" style="width: 50%;">1</div>
    </div>

也许是这样的？还是我误会了你？使用 Float，如果达到 >100%，它将“中断”。

JsFddle