jquery .width doesn't work as expected in IE8
<p>Hello all here's a nice one...</p>

<p>I have a drop down and when I click it open in IE8 ... the position is wrong because it's not reading the width of the div correctly... however when i click it close it jumps to the correct position and closes... It works fine in all the other browsers even works fine in IE7... but for some reason IE8 doesn't want to comply... </p>

<p>Here's the code...</p>

<p><a href="http://jsfiddle.net/PHZpv/2/" rel="nofollow">http://jsfiddle.net/PHZpv/2/</a></p>

<pre><code>    $("#btn-login").click(function () {

    var buttonPos = $(this).offset();

    var loginDropdown = $("#login-dropdown-wrapper");

    console.log(loginDropdown.width() + "px"); //  this returns 4 px.... on dropdown... but is ok on slide up... returns 240px...


    loginDropdown.css({
        "left": buttonPos.left - loginDropdown.width() + $(this).outerWidth() + "px",
            "top": buttonPos.top + 45 + "px"
    })
        .slideToggle(400);

    console.log(loginDropdown.width() + "px"); // this one always returns 240px.....

});
</code></pre>

<p>There are notes added in the code to explain the issue....</p>

<p>any help will be appriciated...</p>

<p>I can hard code the width but i dont want to do that since jquery took the $.browser support away ... there is no easy way of saying IF(ie8) any more... (not that i know of)... unless you know exactly what future of IE8 is causing this then you can call the $support thing and add an exception....</p>
