JSFiddle - React, Tailwind, and code Playground

by Mike McCaughan

HTML

<table>
    <tbody>
        <tr>
            <td></td>
            <td>
                <div class="field-readonly-select">
                    <select class="grid-select field-readonly" readonly="readonly">
                        <option>Words, words, words</option>
                        <option>Text, text, text</option>
                    </select>
                    <div class="field-readonly-select-hider"></div>
                </div>
            </td>
        </tr>
    </tbody>
</table>

CSS

.field-readonly-select { clear: both; position: relative; max-height: 24px; overflow: hidden; }
select.field-readonly { border-style: none; cursor: text; }
.field-readonly-select-hider { 
    background-color: #FFF; 
    height: 20px; 
    position: absolute; 
    width: 20px; 
    top: 1px;
    right: 2px;
}