如何在我的標題下對齊我的div？

如何使我的文檔和視頻在我的引導程序標題jumbotron下水平對齊？我只是希望內容與其正下方的標題一致。如何在我的標題下對齊我的div？

CSS

.container2 { 
     display: flex; 
     flex-flow: row nowrap; /* Align on the same line */ 
     justify-content: space-between; /* Equal margin between the child elements */ 
     }

HTML

<div class="container2"> 
     <div class="left"> 
      <p style=" margin: 12px auto 6px auto; font-family: Helvetica,Arial,Sans-serif; font-style: normal; font-variant: normal; font-weight: normal; font-size: 14px; line-height: normal; font-size-adjust: none; font-stretch: normal; -x-system-font: none; display: block;"></p> 
      <iframe class="scribd_iframe_embed" src="https://www.scribd.com/embeds/344420651/content?start_page=1&view_mode=scroll&access_key=key-8enfvS2L2K0nh24zmVG8&show_recommendations=true" data-auto-height="false" data-aspect-ratio="0.7729220222793488" scrolling="no" id="doc_97914" width="400" height="400" frameborder="0"></iframe> 
     </div> 
     <div class="center"> 
      <p style=" margin: 12px auto 6px auto; font-family: Helvetica,Arial,Sans-serif; font-style: normal; font-variant: normal; font-weight: normal; font-size: 14px; line-height: normal; font-size-adjust: none; font-stretch: normal; -x-system-font: none; display: block;"></p> 
      <iframe class="scribd_iframe_embed" src="https://www.scribd.com/embeds/344420651/content?start_page=1&view_mode=scroll&access_key=key-8enfvS2L2K0nh24zmVG8&show_recommendations=true" data-auto-height="false" data-aspect-ratio="0.7729220222793488" scrolling="no" id="doc_97914" width="400" height="400" frameborder="0"></iframe> 
     </div> 
     <div class="right"> 
      <iframe width="560" height="315" src="https://www.youtube.com/embed/6O7VlTCPYVU" frameborder="0" allowfullscreen></iframe> 
     </div> 
     </div>

全部站點代碼 - https://jsfiddle.net/1mx7ygr1/

我知道，我使用的是引導和使用編碼的頁面和網頁的其它方式沒有完全響應。然而，試圖獲得基本的點，並獲得基本的理解，而不是像我剛剛開始時那樣發展我的技能。

來源

2017-04-08 l.docherty1

是視頻和文件在您的片斷在同一行未對齊還是我失去了一些東西？它們不在你的導航欄標題下嗎？ – repzero

更新後，我正在尋找文件和視頻與標題對齊。 –

垂直，還是水平？直接在對方下面？在右邊？你仍然有點模糊。 –

.left和.center div中有一個不必要的段落標記。這些段落是空的。他們也在增加空間。

其更改爲display:none或刪除（如果你想）

.left p,.center p{ 
    display:none !important; 
}

fiddle is here

來源

2017-04-08 15:11:10 repzero

請重新閱讀我的答案....我說如果必要刪除元素。我不能說p標籤是否在稍後時間裏放置了什麼東西。 – repzero

p標籤是塊元素，不管它們是否爲空它們將增加空間....這是什麼導致文檔div下移..自私是你看到的東西工作，仍然投票下來 – repzero

你還沒有看到在我的答案中的一個片段 – repzero

如何在我的標題下對齊我的div？

回答

相關問題