Ticket #4319 (closed bug: fixed)

Opened 6 years ago

Last modified 4 years ago

Accordion overflow breaks when displayed inside a dialog on Internet Explorer

Reported by: Rich2k Owned by:
Priority: minor Milestone: 1.8.3
Component: ui.accordion Version: 1.7
Keywords: Cc:
Blocking: Blocked by:

Description

Hi

I discovered a curious problem when displaying a collapsable accordion inside a dialog on Internet Explorer 7.

When opening an accordion the overflow of the dialog overlaps the dialog buttons at the botom and whilst the scrollbars display it does not function.

From looking in the CSS it was fixed by changing the following

.ui-accordion .ui-accordion-header { cursor: pointer; margin-top: 1px; zoom: 1; }  
.ui-accordion .ui-accordion-header .ui-icon { float:left; margin-top:6px; margin-left: 2px; }   
.ui-accordion .ui-accordion-content { padding: 1em 2.2em; border-top: 0; margin-top: -2px; top: 1px; margin-bottom: 2px; overflow: auto; display: none; }  

Attachments

jqueryaccordionbug.png Download (14.1 KB) - added by Rich2k 6 years ago.
Screenshot under IE7

Change History

Changed 6 years ago by Rich2k

Screenshot under IE7

comment:1 Changed 6 years ago by rdworth

  • Component changed from ui.core to ui.accordion

comment:2 Changed 5 years ago by scott.gonzalez

  • Milestone changed from TBD to 1.8

comment:3 Changed 5 years ago by scottjehl

Unfortunately, this breaks our standard for positioning icons appropriately next to text of various font sizes. There's a thread here for more discussion:  http://groups.google.com/group/jquery-ui-dev/browse_thread/thread/ee29096b1d32ec78#

comment:4 Changed 5 years ago by scottjehl

Did you try setting position: relative on the dialog content area? Let us know if that works instead of digging into each plugin's reaction to an overflow auto parent. Might be the easiest way to fix this issue.

comment:5 Changed 5 years ago by LynXor

removing "position: relative" fixed for .ui-accordion-content and .ui-accordion-header fixed the problem for me. IE apparently, doesn't interpret position: relative the same way as the rest of the world..

comment:6 Changed 4 years ago by scott.gonzalez

  • Status changed from new to closed
  • Resolution set to fixed

Fixed in  cdd6161.

comment:7 Changed 4 years ago by scott.gonzalez

  • Milestone changed from 1.9 to 1.8.3

comment:8 Changed 4 years ago by Scott González

Dialog: Add positioning for content div. Fixes #4319 - Accordion overflow breaks when displayed inside a dialog on Internet Explorer.

Changeset: cdd6161419190e9d5a1e823f4910559dbab6de7d

Note: See TracTickets for help on using tickets.