正如你可以在下面的小提琴:
http://jsfiddle.net/EvWc4/3/中看到的,我正在搜索一种方法来将第二个链接(link-alt)与父节点(p)的右侧对齐。
为什么不使用浮点数或位置:绝对你会说,主要原因是我喜欢链接的显示(内联块)属性允许它们以自然的方式垂直对齐。
使用float或position:absolute;我将被迫计算并放置一些额外的margin-top或top值来垂直对齐链接。
这是代码,但更好的看到小提琴http://jsfiddle.net/EvWc4/3/:
<p> <a href="#" class="link">link</a> <a href="#" class="link link-alt">link alt</a> </p> p { padding: 20px; background: #eee; } .link { display: inline-block; padding: 10px; background: #ddd; } .link-alt { padding: 20px; }
感谢提前!
解决方法
要使用CSS3,您可以使用弹性框模型
HTML:
<div class="content"> <div class="Box Box1"><a>Link 1</a></div> <div class="Box Box2"></div> <div class="Box Box3"><a>Link 2</a></div> </div>
CSS:
.content { display: Box; Box-orient: horizontal; Box-pack: center; Box-align: center; } .Box2 { Box-flex: 1; }
(需要供应商前缀)
@L_403_2@