css - 移动嵌入式 Youtube Iframe 无法播放

Question

我的网站上有一个无法播放的 youtube iframe 视频，但只能在移动设备上播放（我在 iPhone5 上使用 iOS7）。它在我测试过的桌面浏览器中运行良好，所以我不确定为什么它不能播放，只能在我的移动设备上播放。我从未在 iOS6 上测试过它。

我正在使用媒体查询来控制 iframe 的宽度和高度，但不明白为什么会产生问题（此外，媒体查询与桌面上的视频配合得很好）.. 你对它为什么获胜有任何想法吗不玩？您可以在http://nickbewley.com/music/lee-fields/上查看该问题的示例。感谢您的任何想法！

Answer 1

以下div是重叠的..您无法单击/触摸它来播放。

<div class="music-description">My Favorite Album by Lee Fields: </div>

忘记z-index那只是掩盖问题。而是解决问题：

.music-description {
    display: block; /* REMOVE */
}

.music-title {
    display: inline; /* REMOVE */
    display: block; /* ADD */
}

或者只是将span标签更改为divs（指.music-title）

这样做会给你你正在寻找的风格。