MediaElement.js audio/video fallback links and audio player do not render well in iOS

[nacin]

From davidjlaietta in #23798:

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.

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

iOS Chrome with webM: ​http://core.trac.wordpress.org/attachment/ticket/23798/2013-07-28%2018.02.02.png

iOS Safari with webM: ​http://core.trac.wordpress.org/attachment/ticket/23798/2013-07-28%2018.02.28.png

Patch against the minified MediaElement.js source: ticket:23798:23798.3.diff​

Additionally, the audio player renders too wide, breaking the layout.

[markjaquith]

24902.diff fixes the audio (working player) width issue, which was one of the width-breaking iOS issues I found.

[markjaquith]

24896.diff​ fixes the audio (working player) width issue, as well as the me-cannotplay video and audio width issue.

[nacin]

Should that be max-width: 100%, or width: 100%?

[nacin]

Refreshed to remove script-loader changes.

[nacin]

In 24948:

Set audio player to width: 100% and avoid breaking the layout in iOS when we fall back to a link.

props markjaquith, davidjlaietta.
fixes #24896.

[nacin]

In 24949:

Set audio player to width: 100% and avoid breaking the layout in iOS when we fall back to a link.

Merges [24948] to the 3.6 branch.

props markjaquith, davidjlaietta.
fixes #24896.