使用显示块为两个div设置样式,使它们之间没有双边框,并使下一个项目转到新行

Question

我有两个字母,我想彼此相邻,并带有边框:

HTML:

<div class="status">C</div>
<div class="status">A</div>

<a>A link</a>

CSS:

.status{ 
    display: block;
    float:left; border: 3px solid gray;   
    font-size: 3em
}

跟着它们还有一个锚.

好的,所以这会生成带有边框的C和A但是你可以看到:

http://jsfiddle.net/FgqHa/1/

它们之间的边界由C的边界和D的边界组成.因此,它们之间的厚度是两倍.6像素.

有人可以建议最好的方法,使两者之间的边界只有3px？

该链接也应该出现在下一行,但是在字母的右边.如何强制它到下一行？

Answer 1

这应该适用于动态的元素列表:您编辑的jsfiddle.

神奇的是伪类:first-child(:last-child也是可能的).