Page MenuHomePhabricator

Media handler interface is misaligned inside a table
Closed, ResolvedPublic

Description

The buttons (and the container itself) of the first example are not in the correct place:
https://en.wikipedia.org/wiki/WP:Sandbox?oldid=631736318&action=edit&preview=yes
The second one, which is not inside a table, is ok.
In the broken example, the container seems to have some border spacing.

I see the same problem on ptwiki, using Firefox 33 or Chrome 38:
https://pt.wikipedia.org/w/index.php?oldid=40416350


Version: unspecified
Severity: normal
URL: https://en.wikipedia.org/wiki/WP:Sandbox?oldid=631736318&action=edit&preview=yes

Details

Reference
bz72758

Event Timeline

bzimport raised the priority of this task from to Needs Triage.Nov 22 2014, 3:49 AM
bzimport set Reference to bz72758.
bzimport added a subscriber: Unknown Object (MLST).

Created attachment 17166
aligns when applying appropriate styling

It's not misaligned, a raw table has default borderspacing, cellpadding and etc. Setting border collapse, spacing: 0 and padding: 0 aligns it just fine.

Attached:

Screen_Shot_2014-11-19_at_01.28.09.png (149×286 px, 18 KB)

Created attachment 17171
The triangle does not align if the player is inside a table

I don't think the styles unrelated to the interface of the media handler should be affecting its *internal* alignment. Specifically, even if there is some padding or margin in the cell, I expect the play triangle no to be touching the horizontal line in the bottom.

Attached:

align-bug.png (250×340 px, 19 KB)

(In reply to Helder from comment #2)

Created attachment 17171 [details]
The triangle does not align if the player is inside a table

I don't think the styles unrelated to the interface of the media handler
should be affecting its *internal* alignment. Specifically, even if there is
some padding or margin in the cell, I expect the play triangle no to be
touching the horizontal line in the bottom.

I agree.

Attached:

align-bug.png (250×340 px, 19 KB)

The button offset is caused by the display:table of the .ui-helper-clearfix::before produced by ui-helper-clearfix on the controlbar.

these days, people say that
.group:after {

content: "";
display: table;
clear: both;

}

should be enough and that before isn't rly needed.

Gilles triaged this task as Lowest priority.Nov 24 2014, 1:35 PM
Gilles subscribed.

This problem seems to be already solved.

Can someone confirm and mark this task as "Resolved"?

TheDJ claimed this task.

This was due to a change in clearfix support of jQuery-ui, that got broken due to an update, and then fix somewhere along the way...