thead wrapping Firefox

by karin

HTML

<table>
    <thead>
        <tr>
            <th><div>2016<span >span</span></div></th>
            <th><div>2017<span class="ui-icon ui-icon-carat-2-n-s"></span></div></th>
            <th><div>2018<span class="ui-icon ui-icon-carat-2-n-s"></span></div></th>
         </tr>
    </thead>
    <tbody>
        <tr>
            <td>1</td>
            <td>2</td>
            <td>3</td>
        </tr>
    </tbody>
</table>

CSS

/*Why does this not work in Firefox 41.0*/
 table thead tr th {
    text-align:right;
    white-space:nowrap;
}

table thead tr th div{
    display:block;
    float:right;
}
.ui-icon {
    display: inline-block;
}