Weird IE7 Bug - maybe a float issue?

Here is my site: http://smartpeopletalkfast.co.uk/ppr14/

In IE7 sometimes the last link in the menu 'contact' is being pushed down to the next level, and other times it's not.

If I resize the bro开发者_如何学编程wser window it repeatedly jumps from being all in a line like its supposed to, and pushing the last link down. The weird thing is that its not right/wrong under or over a certain width, it continues to jump around as I resize.

Any one have an idea why this is happening? Ive never heard of a bug like this before. Thanks

As far as I'm aware, it is unfortunately a bug in how IE7 distributes percent widths. I assume IE7 simply rounds the width of the elements to nearest pixel. Thus, for example, when the total width is 25, 26, 27, the width rounds down and all the elements fit nicely within the parent element. However, if the width is 28 or 29, the widths round up, which totals to wider than the parent element, pushing the last element down.

To go around this, you simply have to make the elements smaller, so that even when they widths round up, they wont push the last element down. For example, just setting the width to 19% should make sure that all the elements are on the same row even on IE7. Naturally, the elements wont be perfectly evenly centered after that, but is that likely to be noticed? (You could also use empty elements at beginning and end to even it out, but it's a bit trickier)