[IE] Tab key to dialog buttons shift their position

[Garry Yao]

Environments

IE7 Standards mode

Procedures

1. Open 'link' dialog;
2. Tab through the dialog fields until reach 'Ok' button;
3. Actual result:
   • All buttons position at the bottom of dialog now shift left.

[Frederico Caldeira Knabben]

Confirmed with CKEditor 3.0.

[Garry Yao]

The culprit here is the 'display:inline-table' applied on the footer table which cause IE7 to be buggy, I had to say the coming patch is really a quick dirty fix ( with hard-coding border sizes ) which use another approach to right align the footer.

A decent fix could relate to the fixing of #4174.

[Tobiasz Cudnik]

Attaching reference patch which works-around this issue in another way. Works with other dialogs in Kama skin, could have issues in other skins.

[Garry Yao]

@Tobias, with the patch I could still saw the shifting.

[Garry Yao]

After some investigation I found a even more simple fix, that the shift will no longer happen once we give the wrapper div (.cke_dialog_footer) a fixed size, attaching a new patch.

[Frederico Caldeira Knabben]

I'm testing it with IE8 in compat mode and the footer size is not calculated properly. There should be some CSS magic for it.

[Garry Yao]

I'm having it working perfectly with IE8 compact, which dialog specifically?

[Frederico Caldeira Knabben]

I've attached a screenshot of the issue.

An additional note... it happens only when loading the sample page in a clean cache IE8.

[Garry Yao]

Confirmed, delay the calculation a bit resolves this issue.

[Garry Yao]

Plz hold with the review, I'm composing something that could fix both this and #4174.

[Garry Yao]

I'm proposing a new dialog layout (theme) based on table structure, which benefits from table cell's scalable size natural to well emulate the max/min style (we'd ever introduced at #3878) for all unsupported browsers (IE6/7).
The result is pretty in expectation, that we completely forget about dialog scrollbar issues (#4174,#4540,#3743,#3787,#3962,#4122) and it appears to eliminate many weirds from dialog system, e.g. this bug and #4122.
The patch should be well tested in all browsers of all modes with all skins, though I've tested it exclusively already.
After closing this ticket, we should begin to look for swiping those hacks that aren't necessary anymore in existing dialog parts.

[Frederico Caldeira Knabben]

• Sometimes (on first call) the dialog open aligned to the top of the page in FF.

• The v2 and office2003 dialogs have broken layout in FF. Ok in IE.

• In browsers that support it, we could now use "min-width" instead of "width" for the dialog contents area. This makes the size calculation a bit better (in FF at least).

[Frederico Caldeira Knabben]

Btw... great job really!

[Garry Yao]

As discussed with Fred:

Sometimes (on first call) the dialog open aligned to the top of the page in FF.

Confirmed with Fred it's pretty hard to reproduce, besides it probably not brought by this patch.

The v2 and office2003 dialogs have broken layout in FF. Ok in IE

Fixed with new patch.

In browsers that support it, we could now use "min-width" instead of "width" for the dialog contents area. This makes the size calculation a bit better (in FF at least).

We'll need to introduce browser sniffing again, and it's hard to guarantee that every browser agree with the same thing, let's leave it for later investigation.

[Garry Yao]

Fixed with [4668].