我不明白为什么这行不通?我试图让按钮在 div
中居中。出于某种原因,无论我做什么,按钮都会在 div
中左对齐。
这是我当前的 HTML,我认为它绝对可以工作,但不行。
<div class="row block well" id="section3">
<h1 style="text-align:center">Client Testimonials</h1>
<div class="col-md-3"></div>
<div class="col-md-6">
<p id="quote">Delighted with my experience. Easy and comfortable. I have the utmost confidence in Scott and trust him to help me find the right vehicle for my self, family members and friends I have referred. I just purchased my 4th car from him.<br>
<button class="buttonz" onclick="cycle()"><span>More </span></button>
</p>
</div>
<div class="col-md-3"></div>
</div>
这是正在处理的 CSS
.buttonz {
display: inline-block;
border-radius: 10px;
background-color: #b5cfc1;
border: none;
color: #FFFFFF;
text-align: center;
font-size: 28px;
padding: 20px;
width: 200px;
transition: all 0.5s;
cursor: pointer;
margin: auto;
}
.buttonz span {
cursor: pointer;
display: inline-block;
position: relative;
transition: 0.5s;
}
.buttonz span:after {
content: '\00bb';
position: absolute;
opacity: 0;
top: 0;
right: -20px;
transition: 0.5s;
}
.buttonz:hover span {
padding-right: 25px;
}
.buttonz:hover span:after {
opacity: 1;
right: 0;
}
谁能找到我哪里出错了?
最佳答案
试试下面的 css 来让按钮居中。
.buttonz { display: block; margin: 0 auto; }
关于html - 无法居中对齐按钮,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/41733201/