html - 响应式 A 标签

Question

有谁知道我如何将这两个按钮居中，以便无论用户屏幕大小如何，它们都位于页面的中心底部？

<a class="my-button" title="Relevant Title" href="#">Back</a><a class="my-
 button" title="Relevant Title" href="#">Next</a>

.my-button {
    display: inline-block;
    margin: 5px;
    background: #32CE87;
    color: white;
    font-size: 1.5em;
    font-family: 'Raleway', sans-serif;
    text-align: center;
    border-radius: 5px;
    padding: 8px 16px;
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    transition: all 0.2s;
    left:30rem;
    right:10rem;
    position: relative;
    top:-4rem;
    width: 100px;
    text-decoration: none;
}
.my-button:hover {
    background: #666;
    color: #c1e1e0;
}

Answer 1

给你:

https://jsfiddle.net/nghpf7e7/

需要将其包裹在一个 div 中并应用样式:

.center-bottom {
    position: fixed;
    bottom: 0;
    width: 100%;
    text-align: center;
}