Audio: Fallback link gets cropped by fixed-height container.

[mfields]

The "Download File" fallback for the audio shortcode is hard to read in all of my tests. Here are some screenshots:

• ​Twenty Ten
• ​Twenty Eleven
• ​Blog Simple
• ​Adventure Journal

I tested with a WMA file. It appears that the .me-cannotplay element is given a height greater than .wp-audio-shortcode. I've observed this in Both Chrome and Firefox.

A possible solution is to display a simple text link in a paragraph that would inherit style already provided by the theme. This would also ensure that the text is always readable in cases where the user's fontsize is bumped to a large value which would be cut-off by the hardcoded 30px height of .wp-audio-shortcode.

[SergeyBiryukov]

Related: #23282

[wonderboymusic]

I have attached what we in the business call a "HACK" that makes the error state contort into a plain old link. MediaElement allows you to hook into the error, but the custom code runs after that player is rendered in its own error state. If anyone else wants to take a look at this, have at it!

[kovshenin]

I think MediaElement should not be trying to handle files it does not support. 23798.2.diff​ falls back to a regular link for unsupported audio. Also related: #24076

[markjaquith]

+1 for falling back to a link.

[nacin]

In 24519:

Media: Render unsupported audio files as links instead of mediaelement. props kovshenin, fixes #23798.

[davidjlaietta]

Testing today at WCSF dev day, noticed that on iOS mobile browsers, fallback me-cannotplay div breaks site layout because it has hardcoded height and width values. See attached screenshots for iOS Chrome and Safari. Any default theme has this issue.

[davidjlaietta]

iOS Chrome webM

[davidjlaietta]

iOS Safari webM

[davidjlaietta]

If we change the hardcoded height and width of the me-cannotplay element to auto, issue is resolved.

[davidjlaietta]

remove hardcoded height and width from me-cannotplay element

[nacin]

Re-opening for review.

[nacin]

wonderboymusic has looked at this, and asked John Dyer (ME.js developer) to weigh in. I don't think this is terribly severe, and if it waits until 3.6.1, then it waits until 3.6.1.

[nacin]

Closing this one out in favor of #24896, as this ticket should be closed on the 3.6 milestone, but #24896 may need to wait for 3.6.1.