jQuery select/dropdown and button position issue

jQuery select/dropdown and button position issue

Hi all,
 
I have following page:
  1. <html xmlns="http://www.w3.org/1999/xhtml" >
    <head id="Head1" runat="server">
        <title>GetDropdownData</title>
        <script type="text/javascript" src="/Scripts/jquery-1.4.1.min.js"></script>
    </head>
    <body>
        <div>
        <select id="drDropdown" name="drDropdown">
        <option>aaa</option>
        <option>bbb bbbb</option>
        </select>
        <input type="submit" value="Next" />
        <br /><br /><br />
        <input id="btn" type="button" value="Load Dropdown" />
        </div>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#btn').click(function () {
                $.ajax({
                    type: "Post",
                    url: "/Test/GetDropdownData/",
                    dataType: "json",
                    error: function (request, error) {
                        alert("readyState: " + request.readyState + "\nstatus: " + request.status);
                        alert("responseText: " + request.responseText);
                        alert('Error ' + error);
                    },
                    success: function (data) {
                        data = $.map(data, function (item, a) {
                            return "<option value=" + item.Id + ">" + item.Name + "</option>";
                        });
                        $("#drDropdown").html(data.join(""));
                    }
                });
            });
        });
    </script>



































  2. </body>
    </html>
 
The function is very simple, there is a drop down, a submit button and another button.
 
When page is initially loaded the drop load is loaded with 2 items, the layout looks good in both IE8 and FF3.6 -- the submit button just stays beside the dropdown.
 
When I click the "Load Dropdown" button to load the content from server side dynamically, the width of drop down changes based on returned string length. Now the funny thing happens, in IE8 the submit button next to drop down just stays there, if the drop down width increases, the submit button stays on top of drop down. While in FF3.6 it works fine, the position of submit button adjusts itself and always stays next to the drop down.
 
I have no CSS referenced at all, no inline styles defined.
 
Any clue what is wrong?
 
Thanks
Hardy