使用CSS而不使用中断元素的垂直布局？

是否可以实现垂直布局与只有CSS，而不是HTML元素？使用CSS而不使用中断元素的垂直布局？

我有一个div div内的列表。默认情况下，下一个元素是最后一个元素，当右边没有地方时，它放在下面。

我想实现与CSS样式设置相同。可能吗？

通过CSS-只有我的意思是，我们的div和它的孩子，和不添加任何特殊，如：

断行元素（<br/>, <div style="clear:both;"/>）
UL标签
表（是的，仍然使用，fg JSF几乎完全基于它们）

因此：

<div id="menu"> 
    <a href="something1">Page 1</a> 
    <a href="something2">Page 2</a> 
    <a href="something3">Page 3</a> 
</div>

和CSS实现垂直布局：

#menu { ??? } 
#menu a { ??? }

有什么???我可以用来实现我想要的？

来源

2013-02-13 Danubian Sailor

那么，你想让你的标签并排？或顶部 – iConnor 2013-02-13 12:16:47

一个在其他之下，好像有一个
后，每个锚 – 2013-02-13 12:19:15

我已经添加了我的答案 – iConnor 2013-02-13 12:22:52

将锚标记显示为块元素。

#menu a { 
display: block; 
}

来源

2013-02-13 12:17:04 KBN

这是如此简单，我不相信我不能谷歌搜索使用CSS的垂直定位.. – 2013-02-13 12:25:59

你的意思是这样的吗？

http://jsfiddle.net/7Y9jS/

#menu { 
    width: 300px; 
} 

#menu a { 
    display: block; 
    background: #ccc; 
    color: #000; 
    padding: 10px 0; 
    text-align: center; 
    margin-bottom: 2px; 
} 


<div id="menu"> 
    <a href="something1">Page 1</a> 
    <a href="something2">Page 2</a> 
    <a href="something3">Page 3</a> 
</div>

来源

2013-02-13 12:17:42

显示：块是关键 – 2013-02-13 12:24:53

组显示块到

#menu a { 
    display: block; 
}

来源

2013-02-13 12:20:24

使用浮法左

#menu a { 
    float:left; 
}

，然后将类组添加到你的#menu

.group:before, 
.group:after { 
    content: ""; 
    display: table; 
} 
.group:after { 
    clear: both; 
} 
.group { 
    zoom: 1; /* For IE 6/7 (trigger hasLayout) */ 
}

来源

2013-02-13 12:22:37 iConnor

使用CSS而不使用中断元素的垂直布局？

回答

相关问题