Question

我的YouTube iFrame存在问题：当我设置保证金（负数）时，它变得无法点击。这不是我想要的！我希望访问者能够在我的网站上播放视频。

要添加更多上下文，它是一个Bootstrap网站，视频位于时间轴中。我设置了负边距，这样我就不会在页面上丢失空间。如果我没有设置边距，我会得到一个左项 - 右边的所有内容都是空白的 - 然后在滚动到第一个项目的末尾后，我得到右边的第二个 - 但是左边的所有内容都是空白的，并且等...... 我尝试使用相对和绝对位置，但它在引导时间轴中不起作用（当我更改它时，每个项目都会崩溃）。

您对此问题有任何想法或线索吗？

以下是我的HTML的样子：

<li style="margin-top: -140px">
      <div class="timeline-badge"><i class="fa fa-gamepad" id="round"></i></div>
      <div class="timeline-panel">
        <div class="timeline-heading">
          <h4 class="timeline-title">Solitaire Android app</h4>
          <p><small class="text-muted"><i class="glyphicon glyphicon-time"></i> November 2016 - Work in Progress</small></p>
        </div>
        <div class="timeline-body">
          <p style="margin-bottom: 10px;">This solitaire card game is an Android application, that tells the player when there is no more move to do.
          This feature exists on iOS but not on Android, as far as I know. 
          So I wanted to do this to avoid the player to lose time in looking for a solution that does not exist.
          You can play by dragging and dropping cards on the screen.
          I plan to publish it on the Play Store! </p>
            <div class="embed-responsive embed-responsive-16by9">
            <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/A2nMAct2w88"></iframe>
          </div>
          <p style="margin-top: 10px;"><i>Technologies used: Java, Android</i></p>
        </div>
      </div>
    </li>

这是我的WIP网站的链接，如果可以提供帮助：）

http://horlogehumaine.net16.net/slegras/code.html

Answer 1

你是在谈论＃14; Solitaire Android App＆＃34;中的小视频吗？

如果是这样的话，它会相对定位在其他相对/绝对定位的事物中，这些事物会覆盖＆＃34;它。

.embed-responsive z-index：1;

YouTube iFrame由于边距而无法点击（Bootstrap）

1 个答案: