Css 如何在不改变填充或边距的情况下更改jQuery移动按钮中的文本大小？

我正在使用css在网格中设置一些按钮的样式，我需要在一些按钮中使文本变小，以使其适合，但不改变边距或填充

我正在使用这个css，改变字体大小会使整个按钮的大小略有改变，同时也会改变填充和边距，使它们在网格上的排列方式不同

.my_menu_btn{
    text-shadow:none !important;
    border-radius: 10px !important;
    font-size: 0.7em;
    font-weight: bold;
    box-shadow: 0px 1px 3px 1px lightgray;
    height:40px !important;
    box-sizing:border-box !important;
    max-width: 98% !important;
    margin-left:auto;
    margin-right:auto;
}

---

有没有办法在不改变任何其他内容的情况下改变字体。我真的不明白为什么字体大小会改变填充和边距

jQM CSS中的边距/填充使用的是单位而不是像素；em基于当前字体大小。因此，当字体大小减小时，有效边距也会减小

您的解决方法是将文本放在按钮内的跨距内，然后更改跨距的字体大小：

<button ><span class="my_menu_btn">some longer text in span</span></button>

.my_menu_btn{
    font-size: 0.7em;
    font-weight: bold;
}

---

字体大小不会改变填充或边距，它们是一样的，只是字体占用的空间越来越小，元素也越来越小：尝试使用线条高度来保持相同的高度：线条高度使按钮的大小相同，但按钮底部和下一个按钮顶部之间的边距肯定会受到影响。举个例子，修改代码，我们可以为您提供更多帮助：下面提供了解决方案，谢谢。谢谢！我知道那不是在我脑子里！

button{
    text-shadow:none !important;
    border-radius: 10px !important;
    box-shadow: 0px 1px 3px 1px lightgray;
    box-sizing:border-box !important;
    max-width: 97% !important;
    margin-left:auto;
    margin-right:auto;
}