YouTube iFrame由於頁邊空白而不可點擊（Bootstrap）

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

你談論小視頻，比如說，「Solitaire Android App」？

如果是這樣，那麼它就被相對定位在其他相對/絕對定位的「覆蓋」它的東西之中。

給予。嵌入響應 a z-index：1;