用初始填充动画div

Question

我想使用从0高度到最大高度的“ nav-dropdown”类对此div进行动画处理。由于动画具有初始设置的填充，因此动画从其默认填充开始，然后完成。我希望它从0开始，如何实现呢？

.nav-dropdown {
    z-index: 100;
    padding: 40px 0px;
    position: absolute;
    top: 80px;
    width: 100%;
    background-color: whitesmoke;
    font-family: 'Architects Daughter', cursive;
    text-align: center;
    height: 220px;
    -webkit-animation: expand 2s;
    overflow: hidden;
}

@-webkit-keyframes expand{
    0%{height:0px}
    100%{height:220px}
}