Javascript 我的按钮文本总是显示在我为其设置的填充之外？

我现在已经包括了完整的代码。就像我说的按钮的文本总是超出我为它设置的填充？我只是一个初学者，所以可能会有一些错误，如果有请指出，并感谢您的帮助我

*{
保证金：0；
填充：0；
框大小：边框框；
}  
html{
颜色：#555555；
字体系列：'Lato'，'Arial'，无衬线；
字体大小：300；
文本呈现：优化易读性；
}
.行{
最大宽度：1140px；
保证金：0，自动；
}
标题{
背景图像：线性渐变（rgba（0,0,0,0.7），rgba（0,0,0,0.7）），url（img/hero.jpg）；
高度：100vh；
背景位置：中心；
背景尺寸：封面；
}
.英雄文本框{
位置：绝对位置；
宽度：1140px；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
}
h1{
保证金：0；
字体大小：300%；
颜色：#ffffff；
字体大小：300；
文本转换：大写；
字母间距：1px；
字距：3px；
}
.btn{
显示：内联块；
填充：10px，30px；
字体大小：300；
文字装饰：无；
边界半径：200px；
}
.btn已满{
颜色：#e67e22；
}

杂粮
再见垃圾食品。
你好，超级健康餐。

看起来您正在设置的填充正在将文本推到外部 按钮元素，如果我理解正确的话。你的填充是顺时针的

---

从顶部开始，尝试减少30px或将填充设置为一个常规大小。

看起来您正在设置的填充将文本推到外部 按钮元素，如果我理解正确的话。你的填充是顺时针的

---

从顶部开始，尝试减少30px或将填充设置为一个常规大小。

提供完整的代码，因为这很难解决问题。好的，我将提供完整的代码。为什么css填充属性中有逗号？我只是在没有逗号的情况下放逗号。我的实际代码没有逗号。提供完整的代码，因为它是硬跟踪的问题好的，我会提供完整的代码。为什么你有逗号在你的css填充属性？我只是简单地把逗号后，它没有它的工作我的实际代码没有逗号。