如何使方框阴影从粗边界以下开始?

我有一段CSS:

.ab-banner
{
    background-color: #212121;
    background-image: url(logo.png);
    background-repeat: no-repeat;
    width: 100%;
    height: 45px;
    text-align: right;
    border-bottom: 2px solid #4DD2FF;
}

其产生:

添加此: box-shadow: 0px 2px 2px 0px #000;

产生以下内容:

如果仔细观察阴影,它会从边界的中间开始。增加边界厚度会导致相同的行为,因此不会从层的底部开始。

如何使阴影从边界的底部开始? 我看到你可以通过将边界设置为背景图像来做到这一点 here ,但是在CSS中没有办法做到这一点吗?不过,我可以通过放大阴影来解决这个问题,这不是我的设计所要求的。

这就是我想要的:

编辑: @StackOverFlow UI,你是对的,这将正常工作。谢谢你的榜样!阴影出现在中间的原因是,该样式既应用于表本身,也应用于它所包含的行。从其中一个或另一个中删除该样式类引用可以解决问题。这在布局中发现了一个更深层次的问题,超出了这个问题的范围。接受你的答案,因为它是相关的。