伪元素仅在Chrome中上升1px？

Question

不知道该怎么做。这是页面：http://veloci-rabbit.tumblr.com/

在底部，有两个标签表示＆＃34; Post Type＆＃34;和＆＃34;标记＆＃34;。当您单击它们时，它们将打开（该功能尚未添加，但标签的外观按预期工作）。您可以单击两个标签以打开它们。

在Firefox和IE的最新版本中，这非常有效。在Chrome中，只有在打开一个标签时才有效。如果你打开两者，.labelname div的两个伪元素向下移动1px。不知道为什么会这样。

供参考，这里是标签的相关CSS和HTML：

.footer.labelcontainer {
    position: absolute;
    bottom: 0; left: 25px;
    display: inline-block;
    cursor: default;
}
.footer.label {
    display: inline-block;
    height: 16px;
    margin: 0 7.5px;
    padding: 0 9px;
    border: 2px solid;
    border-radius: 7px;
    font-size: 12px;
    font-weight: bold;
}
.footer.label.opened::before {
    content: '';
    position: relative;
    display: block;
    width: 100%; height: 18px;
    margin-top: -18px; margin-left: -11px;
    padding: 0 0 0 22px;
}
.footer.label.opened::after {
    content: '';
    border-top: 2px solid;
    width: 100%;
    position: relative;
    display: block;
    top: -23px;
    margin-left: -18px;
    padding-right: 36px;
}
.footer.label.opened {
    border-top-style: none;
    border-top-right-radius: 0;
    border-top-left-radius: 0;
}
.footer.labelname {
    margin-top: 2px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    -user-select: none;
}
.opened .footer.labelname::before, .opened .footer.labelname::after {
    content: '';
    position: absolute;
    width: 7px; height: 7px;
    background: transparent;
    border-top: 2px solid;
    top: -7px;
    z-index: 2;
    -webkit-transform: translateZ(0);
}
.opened .footer.labelname::before {
    border-right: 2px solid;
    border-top-right-radius: 7px;
    transform: translate(-200%,0);
}
.opened .footer.labelname::after {
    border-left: 2px solid;
    border-top-left-radius: 7px;
    transform: translate(100%,0);
}

        <div class="footer labelcontainer">
            <div class="footer label unopened"><p class="footer labelname">POST TYPE</p></div>
            <div class="footer label unopened"><p class="footer labelname">TAGS</p></div>
        </div>