2017-08-25 56 views
0

嗨我的行類中有3個div。如何根據裏面的數據自動調整引導列的寬度

<div class="row"> 
    <div class="col-3">some content</div> 
    <div class="col-9"> 
     <div class="col-4"> 
     <div class="col-12"> 
      <div class="col-6">conetnt</div> 
      <div class="col-6">conetnt</div> 
     </div> 
     </div> 
     <div class="col-8"> content </div> 
    </div> 
</div> 

我怎麼能修改此HTML,這樣,所有的內容裏面漂浮的權利,並根據內容自動調整它的寬度是多少?現在寬度是固定的,所以即使我的3rd div中的數據非常少,它仍然會消耗大量的空間。任何想法的傢伙?位新手到CSS

+0

我想浮動我的第二個div內全部內容在向右並與第三格左側 – blackdaemon

+0

堅持嘿你爲什麼不使用COL-MD-1,如果你想要更小的空間 –

+0

,如果你想它應該採取的寬度儘可能多的內容只是使用div沒有任何引導類,並將'''float:left'''應用於父div –

回答

0

解決方案:

如果你的內容佔用的空間小於引導列的寬度。你最好把它放在沒有引導列的類中,並簡單地將它放在你的簡單div內的內容上:float:left

它會根據您的內容自動調整大小。你可能需要給顯示:內聯給你的div來顯示該內聯div。

參考:

首先,你需要學習的引導電網系統的行爲。這個官方Bootstrap文檔全是關於引導程序(最新版本)的網格系統

https://getbootstrap.com/docs/4.0/layout/grid/

這將幫助你瞭解自舉行和列內內容管理。

相關問題