Extra space in Opera

Question

I'm trying to put a progress bar inside td of my table. Here's the code:

<td style="width: 150px;">
        <div style="height: 16px; max-height: 16px; overflow: hidden; border: 1px solid #80C622;">
            <div style="height: 16px; width: 10%; background-color: #bbea7d;"></div>
            <div style="margin-top: -16px; text-align: center;">
                1470/14166
            </div>
        </div>
</td>

Chrome, Firefox, Safari and (!) IE displays it correctly, whereas Opera extends the row so there is some extra space above.

Here's how it's supposed to look like: http://ipicture.ru/uploads/100616/16el6B3lB1.png

Here's how it looks in Opera: http://ipicture.ru/uploads/100616/fE4Ad63N1l.png

How do I fix this?

UPD. Oh yeah, I use Opera 10.53.

Answer 1

Try giving the float to divs and fix width to the outer div (this would be required once you give the float). this is just my guess.