#7170 closed bug (notabug)

Opened March 20, 2011 12:55AM UTC

Closed March 20, 2011 12:59AM UTC

Last modified April 07, 2011 06:13PM UTC

jQueryUI datepicker displays in the wrong place when the body has a fixed width and position: relative

Reported by: dylanbeattie Owned by:
Priority: minor Milestone: 1.9.0
Component: ui.datepicker Version: 1.8.11
Keywords: Cc:
Blocked by: Blocking:
Description

Repro code at http://jsfiddle.net/ZfvUp/

Screenshot at http://www.dylanbeattie.net/misc/jqueryui-datepicker.png

When the HTML BODY element has a fixed width and position: relative, jQuery UI datepicker is being drawn in the wrong place. It appears to be calculating the required position relative to the HTML element (i.e. top/left distance from the browser window), but then positioning the datepicker pop-up relative to the BODY element.

Attachments (0)
Change History (3)

Changed March 20, 2011 12:59AM UTC by rdworth comment:1

_comment0: jQuery and jQuery UI do not support size and position setting on the HTML or BODY elements. → 1300582789020925
resolution: → invalid
status: new → closed

jQuery and jQuery UI do not support size and position settings on the HTML or BODY elements.

Changed April 07, 2011 06:09PM UTC by Andrewiski comment:2

I had a wierd one with ie7, ie8, ie9, and FF, same thing where if datepicker was on the right side and you had scrolled down at all the datepicker would open up or right of the viewport out of view. When you tried to scroll right to see it, it would disapear. I could not figure it out for a couple of days. The issue came down the developer didn't include a <!DOCTYPE html> tag to the page. That was it. No <!DOCTYPE html> it displayed random add <!DOCTYPE html> and the issue was resolved. Chrome, and Safari displayed correctly. I tried UI 1.7.3, UI 1.8.1, and UI 1.9 all gave the same results. Hope this helps anyone else and prevents wierd bug reports from getting submitted.

Andy

Changed April 07, 2011 06:13PM UTC by rdworth comment:3

A doctype ( such as <!DOCTYPE html> though there are much longer ones ) that triggers standards mode is required. Without one the browser is in quirksmode which is not supported by jQuery or jQuery UI.