小编W.B*_*.B.的帖子

我有这个JSFiddle.有人可以解释,为什么锚位置相对于其兄弟姐妹错位？我知道我可以通过位置相对和否定顶部偏移来纠正它,但我不明白,为什么它首先是这样的.

HTML:

<div class="container">
    <div class="left"></div>
    <a href="">Some link</a>
    <div class="right"></div>
</div>

CSS:

.container {
    height: 25px;
    white-space: nowrap;
}

.container .left {
    border: 1px solid black;
    display: inline-block;
    margin: 0;
    height: 25px;
    width: 80px;
    padding: 0;
}

.container .right {
    border: 1px solid black;
    display: inline-block;
    margin: 0;
    height: 25px;
    width: 80px;
    padding: 0;
}

.container a {
    display: inline-block;
    border: 1px solid black;
    height: 25px;
    width: 300px;
    margin: 0;
}