如何內聯div

以下是我在其中div我試圖在div創建一個正方形，我面臨的問題是，當我嘗試創建一個正方形然後正方形去新線。如何內聯div

實施例：

 
My [SQUARE] Should look like this // NO linebreak 

But my // line automatically break 
[SQUARE] 
/* line automatically break */ look like this

注：我不能使用浮子左側和右側，還我試圖顯示：內聯;但它沒有工作。請讓我知道我可以創建一個正方形內嵌到我的內容

<div style="width:10px; height:10px; border:1px solid #000; background:yellow;"></div>

來源

2013-01-11 soft genic

是你的廣場的HTML嗎？ – Morpheus

據我瞭解，這是發生了什麼：

Your content 
[SQUARE] 
More content

而不是

Your content [SQUARE] more content

你試過display: inline-block;

此外，檢查包含div能夠適應單行所有這些內容。

編輯：記住display: block是DEFAULT屬性（大多數）的元素，這將迫使他們在新的一行。因此，要更改此設置，您可以通過設置自定義display:屬性來覆蓋默認設置。

對於他們所有的列表，請訪問：http://www.w3.org/wiki/CSS/Properties/display

來源

2013-01-11 15:20:54 tsujp

好的問題正在解決謝謝...而且我怎麼可以垂直設置方形對齊？ –

如果你需要垂直對齊方塊，那麼你應該在這裏看到我對這個人的帖子的回答：http://stackoverflow.com/questions/14281151/center-small-div-in-big-div-vertically-and-horizontally/14281279＃14281279它也有一個鏈接到一個jsfiddle解釋一切以及http://jsfiddle.net/4Gjxk/1/ – tsujp

嘗試這種加display:inline-block到你的代碼

<div style="display: inline-block; width:10px; height:10px; border:1px solid #000; background:yellow;"></div>

來源

2013-01-11 15:20:33

他提到他已經使用display：inline; – Matthias

對不起，我還沒有看到..現在我編輯 –

如果我得到正確的問題：

嘗試的div styletag內設置display:inline-block;。

希望這個工程。

來源

2013-01-11 15:21:08 Matthias

您需要將display：inline屬性應用於同一行所需的所有元素，否則無法工作，並且如果需要，則可以應用浮動屬性。

來源

2013-01-11 15:35:56 TheGoodGuy

回答

相關問題