这是一个小提琴:http://jsfiddle.net/5s7vv/
我想要做的是有2个按钮向左浮动,2向右浮动,就像示例一样,但button_4应该是最右边的元素.但是,我只能通过一个简单的浮动权来实现.我应该在标记中更改它们的顺序,但这会破坏用户体验(按钮之间的标签顺序错误),这实际上导致了我的问题.
是否可以按正确的顺序向右浮动两个按钮并保持其标签索引,当然也没有额外的标记.(将它们包装在div中很容易,但我真的想避免这种情况).
我知道tabindex属性,但据我所知它没有得到很好的支持......
HTML代码:
CSS:
#container{
width: 200px;
}
#container a{
width: 20px;
height: 20px;
}
.button_1, .button_2{
float: left;
}
.button_3, .button_4{
float: right;
}
.button_1{background-color: blue;}
.button_2{background-color: red;}
.button_3{background-color: green;}
.button_4{background-color: yellow;}
Run Code Online (Sandbox Code Playgroud) 我想我想要做的这种模式将比问题本身更具描述性.
+------------------------+-----------------------+
| | |
+ +-----------------------+
| | |
+------------------------+ +
| | |
+ +-----------------------+
| | |
+------------------------+-----------------------+
| | |
+------------------------+-----------------------+
Run Code Online (Sandbox Code Playgroud)
正如您所看到的,我正在尝试创建一个2列表,在某些时候,它应该能够对其中一列进行行间隔,并最终在接下来的两行中进行行.
我错过了一些明显的方法,或一些高级表标签/属性?或者使用表格无法做到这一点?
我知道可以通过其他方式实现这一点,但表格是我感兴趣的,以及有什么问题.
供参考:有些东西我尝试过但没有成功 http://jsfiddle.net/dbtYk/