如何将 Bootstrap 按钮居中？

Question

我使用 Bootstrap 模块制作了一个按钮，并将其包含在

<div style="text-align: center;">

中。但它仍然不会居中。这里发生了什么，我如何将它放在的中心？

这是完整的 HTML：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <link rel="stylesheet" href="styles.css">
  </head>
</head>
<body>
    <div style="text-align: center;">
        <a href="cv-july-2023.pdf" class="btn btn-primary btn-lg cv-download-button">
            <span>
                <iconify-icon inline="" icon="basil:file-download-solid" style="font-size: 2em;"></iconify-icon>
            </span>
            <span>
                Download CV
            </span>
        </a>
    </div>
        
    <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-kenU1KFdBIe4zVF0s0G1M5b4hcpxyD9F7jL+jjXkk+Q2h455rYXK/7HAuoJl+0I4" crossorigin="anonymous"></script>
    <script src="https://code.iconify.design/iconify-icon/1.0.7/iconify-icon.min.js"></script>
</body>
</html>

这是CSS：

.cv-download-button {
    display: flex;
    align-items: center;
    width: fit-content;
}

如何将 Bootstrap 按钮居中？

问题描述投票：0回答：0

最新问题

如何将 Bootstrap 按钮居中？

问题描述 投票：0回答：0

最新问题

问题描述投票：0回答：0