1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
<!DOCTYPE html>
<html>
<head>
    <style type="text/css">
         .aTable {
             display : table;
             float : right;
             width : 200px;
             border: 1px dotted black;
             border-spacing: 2px;  
         }
         .aTableRow     { display : table-row; border: 1px solid black; }
         .aTableHeading { display : table-header-group; }
         .aTableBody    { display : table-row-group; }
         .aTableFoot    { display : table-footer-group; }
         .aTableCell    { display : table-cell; 
                          border: 1px solid black; 
                          width : 50%;
                          padding: 2px;
                     
                        }            
       
    </style>
</head>
<body>
     <div class="aTable">
         <div class="aTableRow"> 
            <span class="aTableCell" id="span1">This is my first table cell</span>
            <span class="aTableCell" id="span2">This is my second table cell. Second cells are really not that big a deal.</span>
         </div> <!-- /aTableRow -->
     </div> <!-- /aTable -->

</body>
</html>