div中如何让button居中

最近在写公司的网站，出现一个问题就是想让button在div中居中，由于开发系统比较老，在网上搜索的解决方案不用解决问题：

网上的解决方案：

1. 增添display: flex，将父元素转变为弹性容器。
2. 加入align-items: center，实现垂直方向的居中。
3. 添加justify-content: center，达成水平方向的居中。

老版本系统不支持 flexbox 语法，经过搜索，得到以下解决方案：

使用 position 和 transform 的组合方案：

position: relative

transform: translate(-50%, -50%)

完整代码如下：

<div class="col-sm-4 custom-border" id="mydiv" style="background-color: beige; height: 60px; border-collapse: collapse; border:1px solid black; position: relative;">
<button class="btn btn-primary btn-lg" data-toggle="modal" data-target="#myModaltwo" style="position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);">ji</button>
</div>

 最终解决问题。

这里需要说明的是button是块元素，与div中设置文字的格式的方法不一样。