這是可能的顯示DIV彼此相鄰而不浮動？

我想把幾個div放在一行中相鄰。所有div s都有相同的高度。這是可能的顯示DIV彼此相鄰而不浮動？

Here是如何使用float: left來完成的。

這樣做可以不使用float？

來源

2010-09-16 Misha Moroshko

原諒我潛在的無知，但不會在這種情況下使用跨度？ – PurplePilot 2010-09-16 12:19:03

不適用於我：http://jsfiddle.net/fnbVZ/1/ – 2010-09-16 12:25:56

取決於你想要做什麼。您可以使用display: inline-block;

http://jsfiddle.net/sygL9/

來源

2010-09-16 12:06:03 Ragnis

我不知道如何設置'font-size：0'到容器。非常感謝！ – 2010-09-16 12:31:30

您可以使用display：inline-block。但不幸的是，一些瀏覽器（一些IE版本）不支持它。

http://www.brunildo.org/test/inline-block.html

http://www.quirksmode.org/css/display.html

來源

2010-09-16 12:03:48 Palantir

觸發hasLayout和設置顯示：內聯在IE中完成同樣的事情。這是一個黑客雖然 – 2010-09-16 12:06:04

@Matt：很高興知道 – Palantir 2010-09-16 12:07:04

一個display: block元件是（有效地）將不得不在端換行符。一個選項，可以讓你保持塊元素的樣式，而把它在頁面流設置display: inline-block（當然，與some additional work獲得即行爲）

另一種選擇是嵌套它們，它們都設置爲position: relative和使用left規則來對齊它們。

來源

2010-09-16 12:05:12

如果你有改變的div來跨度元素的可能性，這將解決這個問題，而無需使用CSS

<span></span><span></span><span></span><span></span>

來源

2015-11-12 16:43:28 bonzi

-1

#together { 
 
    position: absolute; 
 
    display: inline-block; 
 
\t margin;left:10px; 
 
\t background-color:lightblue; 
 
\t width:500px; 
 
\t border:4px double blue; 
 
}

<div id="together" style="left:10px">first div</div> 
 
<div id="together" style="left:520px">second div</div> 
 
<div id="together" style="left:1030px">third div</div> 
 
<div id="together" style="left:1540px">fourth div</div> 
 
<div id="together" style="left:2050px">fifth div</div> 
 
<div id="together" style="left:2560px">sixth div</div> 
 
<div id="together" style="left:3070px">seventh div</div>

你在這裏，連續七個divs

來源

2016-01-01 20:40:49 Peter

對多個元素使用相同的ID？ ID應該是唯一的。 – 2017-07-11 22:23:30

這是可能的顯示DIV彼此相鄰而不浮動？

回答

相關問題