Div不向左漂

我還是比較新的HTML和CSS，我無法弄清楚這一點。我有三個帶有文本的div，我希望它們彼此相鄰。我把它們設置爲浮動：左邊，但他們沒有這樣做。Div不向左漂

.threethings { 
 
    width: 20%; 
 
} 
 
.threethings div { 
 
    text-align: center; 
 
    position: relative; 
 
    float: left; 
 
}

<div class="threethings"> 
 
    <div><span>Style</span> 
 
    <br> 
 
    <p>Lorem ipsum dolor sit amet, ius te ullum indoctum, sanctus consequat eum te. Nemore recteque necessitatibus et eos.</p> 
 
    </div> 
 
    <div><span>Style</span> 
 
    <br> 
 
    <p>Lorem ipsum dolor sit amet, ius te ullum indoctum, sanctus consequat eum te. Nemore recteque necessitatibus et eos.</p> 
 
    </div> 
 
    <div><span>Style</span> 
 
    <br> 
 
    <p>Lorem ipsum dolor sit amet, ius te ullum indoctum, sanctus consequat eum te. Nemore recteque necessitatibus et eos.</p> 
 
    </div> 
 
</div>

來源

2017-01-22 Ash

試試這個

 .threethings { 
      width : 100%; 
     } 

     .threethings div { 
      width: 20%; 
      text-align: center; 
      position: relative; 
      float : left; 
     }

所以會發生什麼是div的是在你的情況下浮動，但並不是並列的，你是給20％的寬度母公司，由於其孩子不能並排放置。

我所做的是給父母一些寬度和孩子一些小寬度，以便父母可以容納並排的兒童。

以及div是塊。 width:100%可能不是必需的

來源

2017-01-22 16:16:27

謝謝！我將如何去將這些橫向居中放在頁面上？我試圖添加一個0的自動保證金，但它沒有做任何事情。 – Ash

好吧，我會請你研究一下。如果您找不到解決方案，請回複評論，我很樂意提供幫助 –

您正在浮動父類 - 不是包含段落的div。將.threethings類添加到3個嵌套div中，以指示它們將正在進行的div浮起來。

請注意，您可能還需要給div一個固定的寬度，因爲您在那裏的段落可能會超過html正文的長度，這反過來又會迫使它們進入新行。

來源

2017-01-22 16:17:23 Eoghan

嘗試這種解決方案

.threethings { 
     width:100%; 
    } 
    .threethings div { 
     width:33%; 
     position: relative; 
     float : left; 
    }

來源

2017-01-22 16:19:32 Booster

Div不向左漂

回答

相關問題