How do I make a screenreader automatically read cell contents?

Question

I'm trying to use a CSS table to represent a grid of items. My screenreader (NVDA) will automatically read the contents of a focusable div, but not if the div is display: table-cell. Is there a way to make the contents be automatically be read upon tabbing?

<div style="display: block" tabindex="0">Apple (for comparison)</div><br>
<div style="display: table">
    <div style="display: table-row">
        <div style="display: table-cell" tabindex="0">Banana</div>
        <div style="display: table-cell" tabindex="0">Celery</div>
        <!-- Screenreader won't say banana or celery upon tabbing -->
    </div>
</div>

Answer 1

Got it (thanks @bishop). I used role="grid", role="row" and role="gridcell" to make it a grid then used aria-readonly="true" to indicate that the grid is not editable.

<div style="display: block" tabindex="0">Apple (for comparison)</div><br>
<div role="grid" aria-readonly="true" style="display: table">
    <div role="row" style="display: table-row">
        <div role="gridcell" style="display: table-cell" tabindex="0">Banana</div>
        <div role="gridcell" style="display: table-cell" tabindex="0">Celery</div>
    </div>
</div>