小编Pay*_*tte的帖子

在相对父容器中将绝对按钮居中的正确方法

我已经达到了我想要的结果。但这不是正确的方法。例如,如果我的父容器改变了宽度,这个 hack 将不起作用。但是,我这样做只是为了将其显示在屏幕上,以尝试在浏览器中以正确的方式解决问题。

在此处查看屏幕截图

HTML

<div class="container">
                <div class="row">
                    <div class="col-md-4">
                        <div class="product-wrapper">
                            <div class="product-card">
                                <a href="lathes-single.html" class="product-img-wrapper"><img src="../assets/img/46-455.jpg" alt=""></a>
                                <h4> 46-460 12 1/2 in. Variable Speed MIDI-LATHE® </h4>
                                <p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout.</p>
                                <a href="lathes-single.html" class="btn btn-lg btn-primary">View Product</a>
                            </div>
                        </div>
                    </div>
                </div>
</div>
Run Code Online (Sandbox Code Playgroud)

对不起,我古怪的间距。出于某种原因,从 Sublime Text 3 中粘贴出来的东西,一旦来到这里,一切都会被顶起来。

相关 CSS

.product-img-wrapper {
   text-align: center;
}

.product-img-wrapper img {
    width: …
Run Code Online (Sandbox Code Playgroud)

html css css-position twitter-bootstrap-3

2
推荐指数
1
解决办法
1万
查看次数

标签 统计

css ×1

css-position ×1

html ×1

twitter-bootstrap-3 ×1