BxSlider 活动点不与其余点对齐

Question

我有以下网站 here，当我点击旋转木马上的任何点时，活动点会向上移动几个像素，在开发工具中，如果我删除活动点 class，它正确地向后对齐，我不确定是什么原因造成的，因为我附加到 .active class 的唯一属性如下：

.bx-wrapper .bx-pager.bx-default-pager a:hover, .bx-wrapper .bx-pager.bx-default-pager a.active, .bx-wrapper .bx-pager.bx-default-pager a:focus {
    background: #0e2240;
}

padding, margin, height, width of the points 保持不变。

bxSlider控件的HTML如下：

<div class="bx-pager bx-default-pager">
        <div class="bx-pager-item">
            <a class="bx-pager-link active" data-slide-index="0" href="">1</a>
        </div>
        <div class="bx-pager-item">
            <a class="bx-pager-link" data-slide-index="1" href="">2</a>
        </div>
        <div class="bx-pager-item">
            <a class="bx-pager-link" data-slide-index="2" href="">3</a>
        </div>
    </div>

我无法调试为什么会发生这种定位移动，有人可以指出正确的方向吗？

漏洞截图：

编辑：inline-block 似乎没有问题，就好像我删除了 .active class，一切正常美好的。

Answer 1

只给 vertical-align:middle 给 .bx-wrapper .bx-pager-item class。

.bx-wrapper .bx-pager-item {    
    vertical-align: middle;
}

Answer 2

检查样式

.bx-pager.bx-default-pager a.active {}
and
.bx-pager.bx-default-pager a {}

has same css except background-color

BxSlider 活动点不与其余点对齐

BxSlider active dot not aligning with the rest of the dots

html

css

bxslider