这是可能的显示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彼此相邻而不浮动？

回答

相关问题