Details
-
Type: Bug
-
Status: Closed
-
Priority: Major
-
Resolution: Fixed
-
Affects Version/s: 3.2
-
Fix Version/s: EE-3.2.0.BETA, EE-3.2.0.GA, 3.3
-
Component/s: ACE-Components
-
Labels:None
-
Environment:Firefox, Chrome, IE9
-
Assignee Priority:P1
Description
A scrollable ace:dataTable is shown in an ace:dialog component. When this dialog is shown the dataTable headers are miss aligned with the table contents.
This issue was the result of table-layout:fixed being added to Firefox cases.
In Firefox, when resizing a scrollable table in a dialog, misalignments would occur. However the later JS adjustments I'd made to FF scrolling on OS X has reduced the benefits of using table-layout:fixed, so I've removed it with out any notable style regression.
However table-layout:fixed is still being used by necessity in IE9 cases, as without the rule, in horizontally scrollable cases, the columns of the table don't follow their fixed width rules, resulting in a misalignment of several pixels. Luckily when IE9 is layed out inside an ace:dialog, it is not misaligned, rather it is effected by a implication of 'fixed' which is the table will behave as if width:100% has been set on it, which in the case of a very wide table, results in a very wide dialog.
I've attempted to find another configuration to make the IE9 table rendering logic follow the widths more precisely, but have yet to find any. My current suggestion to ameliorate this IE9 behavior is to set a max-width for the dialog.