I am having a big problem with Safari displaying our new persistent cart and countdown timer on our websites. You can see an example of one of these at http://bicycletrailers.com. You will see a timer counting down till when your order will be shipped on the right hand side of the header. For some reason safari is not making the outer div of the timer wide enough.

Basically there is a header div that is positioned relatively and then of course the logo and other utility navs. The timer and cart are in a container div that is positioned from the right and contains the two outer divs of the two little widgets. Theses are both floated right and inside of each one of those are three elements that are floated left. set up like the following

<div id="header positioned relatively">
<div id="cart-countdown and is positioned abs">
<div id="global-cart floated right">
<div id="floated left">
<div id="floated left">
<div id="floated left">
</div>
<div id="countdown floated right">
<div id="floated left">
<div id="floated left">
<div id="floated left">
</div>
</div>
</div>

Its pretty complicated to explain but you will see if you view in Safari that for some reason the outer div of the countdown doesn't make it wide enough for the other two elements. I do use a lot of javascript to do the animations and everything but nothing is used on page load to set any of the widths. When using the Web Inspector of Web Kit it shows that the computed style of the container seems to be exactly missing the same amount of pixels as the left clock image.

The thing that is confusing the most is that this doesn't happen on my local machine when creating it and doesn't happen everytime the page loads on the live site. It seems to mainly happen on the homepage or if you refresh a couple of times. So I have no way to replicate the bug and fix it locally and can't find any type of issue besides some float bugs that don't quite match this.

If anyone has came across something like this, I would really appreciate the help. I am shocked that I can't find any documentation on people having this issue before. The only thing I can think of is similar issues with why the FOUC bug use to happen. It seems to happen only when a lot of the images are loading so I'm thinking maybe something going wrong between the JS and CSS loading.