Popup widget: trigger link positioned > ~865px left causes mis-positioning of popup #4283

adammessinger opened this Issue May 3, 2012 · 2 comments


None yet
2 participants

This bug applies to the in-development popup widget discussed in issue #3218, and the exact behavior varies by browser.

Example: http://jsbin.com/omacox/114

If the link that triggers a popup is positioned more than about 865px (depending on the browser) to the left -- whether because of its own styles or those of an ancestor element -- the resulting popup will have a negative calculated left offset. For some reason, this can be overcome by giving .ui-popup-container a max-width of less than 100%.

On the test page linked above, the following popup-triggering buttons have the problem in the browsers I've tested so far (all on Windows 7):

  • Firefox 12 and IE 9: buttons 2, 6 (at large window widths), 7
  • Chrome 18: buttons 2, 3, 4, 5, 6 (large win widths), 7
  • Safari 5.1.5: buttons 2, 3, 4, 6 (large win widths), 7
  • Opera 11.62: button 6 (large win widths)

gabrielschulhof commented May 8, 2012

I saw the problems on FF 12 on Windows. It seems that sometimes the browser decides to wrap the text and at other times it does not. However, I'm not sure how far the implementation of popup should go. Currently, it makes absolutely no sizing decisions. It merely checks whether a max-size is set, but doesn't actually size the popup. The width and height of the popup are determined entirely by its contents.

Thus, this bug may indicate the need to assign a max-width to the payload div, or override the .ui-popup-container class with a custom style that adds a max-width. I'm not sure that /all/ popups should have a max-width set.


gabrielschulhof commented May 9, 2012

I added a max-width: 90%; to the popup container css. That should fix this and also help #4266. Please let me know if this is not the case.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment