After searching, I stumbled upon this question that appeared to have the solution I needed. Surprisingly, even when using chrome 32.0.1700.102, the fiddle provided in the first answer worked perfectly for me.
However, when I copied the HTML code into a new file and loaded it in chrome, the "computed styles" tab of the tds still displayed display:table-cell;:
<html>
<head>
<style>
#block td {
display: block;
background: #ccc;
}
</style>
</head>
<body>
<table>
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
</table>
<table id="block">
<tr>
<td>a</td>
<td>b</td>
<td>c</td>
<td>d</td>
</tr>
</table>
</body>
</html>
In contrast, when I viewed this in Firefox, it showed the desired outcome:
Take a look at the screenshot from Chrome which demonstrates how the display:block rule is visible in the style tab but display:table-cell appears in the computed tab: