iframe календаря отображается справа от текстового поля в первый раз, а затем под ним

Окружающая среда:
Веб-формы ASP.NET
Элемент управления DetailsView
Режим редактирования

У меня есть date input field, который показывает мой iframe calendar, когда вы щелкаете внутри текстового поля. Все это внутри detailsview edit template element.

В первый раз календарь отображается справа от текстового поля (желаемый результат), но с тех пор, если я скрою его, а затем покажу снова, он появится под текстовым полем. Почему несоответствие? Есть идеи?

$('.update-date-started').on('click',
    function () {
        var $tdElement = $(this);

        var $cal = $tdElement.find('#calFrame');

        if ($cal.length == 0) {
            var iframe = document.createElement("iframe");
            iframe.src = 'CalendarPopup.aspx?field=tbDateStarted';
            iframe.id = "calFrame"
            iframe.width = '275'
            iframe.height = '203'
            iframe.style = "position: absolute;"
            $tdElement.append(iframe);
        }

        $cal.toggle();
    });