HTML/CSS-文本可以'；不要在按钮内居中

所以，这是我第一次接触HTML/CSS，很自然，我在某些部分遇到了问题

我在setup.html中创建了一个“Contine”按钮，并给了它一个类，这样我就可以在styles.css中设置它的样式，现在的问题是文本对齐中心在按钮上不起作用。我在index.html中也有一个“开始”按钮，但奇怪的是文本对齐中心在那里工作。我试着给这两个按钮设置相同的类和不同的类。我不知道现在该怎么办\

我的HTML按钮：

<div class="startcontainer">
        <a href="./home.html">
            <button id="continue"><span>Continue</span></button>
        </a>
</div>

---

正如我所说，我的styles.css中的#contine部分与“开始”按钮完全相同，但它只适用于开始按钮。

问题在于

最大宽度：280px和
填充：10px 100px

您在水平刻度上给出200px的填充，然后将按钮宽度限制为280px。只剩下80px的文本。删除按钮宽度，以更好地查看按钮。或者，您可以在其他CSS属性上权衡任何CSS属性


.startcontainer{
位置：固定；
边界半径：5px；
宽度：计算（100%-20px）；
高度：计算（100%-120px）；
左：10px；
右：10px；
底部：3%；
边缘底部：10px；
填充：0px；
背景色：#1F；
浮动：中间；
文本对齐：居中；
}
.startcontainer a{
位置：相对位置；
显示：块；
保证金：0自动；
最高：40%；
文字装饰：无；
边界：0；
}
.startcontainer a继续{
位置：相对位置；
/*最大宽度：280px*/
最大高度：60px；
线高：60px；
填充：10px 100px；
字体大小：xx大号；
背景色：#1F；
颜色：#FFFFFF；
不透明度：.87；
线高：正常；
字体系列：“开放式Sans”，无衬线；
边框：5px实心#8644A1；
边界半径：45px；
显示：块；
保证金：0自动；
最高：40%；
过渡：0.4s；
大纲：0；
光标：指针
}
.startcontainer a#继续{
显示：块；
线高：30px；
}
.startcontainer a#继续：悬停{
背景色：#8644A1；
}

问题在于
最大宽度：280px和
填充：10px 100px

您在水平刻度上给出200px的填充，然后将按钮宽度限制为280px。只剩下80px的文本。删除按钮宽度，以更好地查看按钮。或者，您可以在其他CSS属性上权衡任何CSS属性


.startcontainer{
位置：固定；
边界半径：5px；
宽度：计算（100%-20px）；
高度：计算（100%-120px）；
左：10px；
右：10px；
底部：3%；
边缘底部：10px；
填充：0px；
背景色：#1F；
浮动：中间；
文本对齐：居中；
}
.startcontainer a{
位置：相对位置；
显示：块；
保证金：0自动；
最高：40%；
文字装饰：无；
边界：0；
}
.startcontainer a继续{
位置：相对位置；
/*最大宽度：280px*/
最大高度：60px；
线高：60px；
填充：10px 100px；
字体大小：xx大号；
背景色：#1F；
颜色：#FFFFFF；
不透明度：.87；
线高：正常；
字体系列：“开放式Sans”，无衬线；
边框：5px实心#8644A1；
边界半径：45px；
显示：块；
保证金：0自动；
最高：40%；
过渡：0.4s；
大纲：0；
光标：指针
}
.startcontainer a#继续{
显示：块；
线高：30px；
}
.startcontainer a#继续：悬停{
背景色：#8644A1；
}

related:and related:这无疑有助于文本居中，即使我的按钮现在看起来有点太大了。但这很容易通过改变填充物来解决。谢谢你的快速回答！：）这无疑有助于文本居中，即使我的按钮现在看起来有点太大了。但这很容易通过改变填充物来解决。谢谢你的快速回答！：）
.startcontainer {
    position: fixed;
    border-radius: 5px;
    width: calc(100% - 20px);
    height: calc(100% - 120px);
    left: 10px;
    right: 10px;
    bottom: 3%;
    margin-bottom: 10px;
    padding: 0px;
    background-color: #1F1F1F;
    float: middle;
    text-align: center;
}

.startcontainer a {
    position: relative;
    display: block;
    margin: 0 auto;
    top: 40%;
    text-decoration: none;
    border: 0;
}

.startcontainer a #continue {
    position: relative;
    max-width: 280px;
    max-height: 60px;
    line-height: 60px;
    padding: 10px 100px;
    font-size: xx-large;
    background-color: #1F1F1F;
    color: #FFFFFF;
    opacity: .87;
    line-height: normal;
    font-family: 'Open Sans', sans-serif;
    border: 5px solid  #8644A1;
    border-radius: 45px;
    display: block;
    margin: 0 auto;
    top: 40%;
    transition: 0.4s;
    outline: 0;
    cursor: pointer
}

.startcontainer a #continue span {
    display: block;
    line-height: 30px;
    
}

.startcontainer a #continue:hover {
    background-color: #8644A1;
}