Question

我一直试图解决这个问题很长一段时间，我找不到一个简单的解决方案。

我有一个双面网格（col-sm-6），一边是文字，另一边是按钮。我无法将这两个垂直和水平对齐。

我能够通过使用行高而不是按钮来对齐文本。好吧，我确实设法使用保证金顶部获得了col中心的按钮，但我不确定这是否正确？此外，如果我使用保证金顶部与否，当我测试它为移动时，按钮跳出带有背景的部分/彩色div。

所以我想要的。首先在正常屏幕上的部分中心进行调整，当你为移动设备调整大小时，每个都在单独的行中，但仍然在彩色的div / section部分内。

请帮我找一个解决方案。

HTML

<div class="col-md-6 col-sm-12 text-center">
    <h3>Interested in what we have to offer?</h3>
</div>
<div class="col-md-6 col-sm-12 text-center">
    <button type="button" class="btn btn-primary btn-lg" id="bannerbtn">Contact us now</button>

CSS

.banner-section{
height: 150px;
background-color: #212529;
}
.banner-section h3{
float:right;
line-height: 150px;
color: #fff;
font-size:25px;
}
#bannerbtn
{
float:left; 
background-color: #6d6e71; /*background:#6d6e71 */
border-color: #fff;
}

https://jsfiddle.net/sd0jnq9p/7/

谢谢

如何对齐网格中心的按钮以便响应使用

0 个答案: