如何使用css防止按钮缩小到小于未包装文本的大小?

基本上我有一个按钮,里面有“删除”这个词。

它当前使用此css:

.btn-delete {
    font-size: 32px;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 15px;
    border-top: 0px;
    color: #fff;
    background: linear-gradient(to bottom, #ff0000, #d40000);
    vertical-align: middle;
    text-align: center;
}

它还使用col-xs-2和col-xs-offset-3。

当我水平缩小窗口时,按钮的背景将缩小,并慢慢删除“删除”文本,直到只看到“D”的一部分。

我如何防止按钮能够切断字体文本?我希望按钮在文本开始被切断之前停止缩小。