Alternative to tables

Is there anyway I can completely get rid of tables on my website and use purely div span etc. rather then all those table td tr tags. This is the way I am doing it right now.

CSS

/* EPISODES TABLE */
table#episodes_table td {
	border-bottom: 1px solid #FFFFFF;
}
table#episodes_table tr.thead td {
	font-weight: bold;
	color: #787878;
}
table#episodes_table tr.on td {
	color: #FFFFFF;
	background: #ac4040;
}
table#episodes_table a {
	color: #000000;
}
table#episodes_table a:hover {
	text-decoration: underline;
}
table#episodes_table tr.off td {
	color: #FFFFFF;
	background: #cc5859;
}

Code (markup):

Table Code

<table id="episodes_table" border="0" cellpadding="4" cellspacing="0" width="100%">
    <tr class="thead">
        <td width="40%">TABLE Titles</td>
    </tr>
    <tr class="on">
        <td>TABLE TEXT</td>
    </tr>
    <tr class="off">
        <td>TABLE TEXT</td>
    </tr>
    <tr class="on">
        <td>TABLE TEXT</td>
    </tr>
</table>

HTML:

 

If you need exactly the same table rendering but without tables in the HTML code : display: table-cell ( don't work with IE ) .

You can also try something with display : inline-bloc or position : absolute .

 

just use div'S give them a class or an id and use the css you can use them like tabless

 

Use float tags in css, they work good and theyre very similar to tables.

 

of course you can use this more easily with DIVs. I think its better you migrate to DIV techniques from the tables since its the latest recommend technique for xhtml. You can use nested divs with an external style sheet to get this done.