Android 在一个DIV中对齐两个按钮，以创建移动响应站点

我想在一个容器DIV中对齐两个按钮，但不知怎的，这对我不起作用。我将图片的链接放在我想要的位置和JSFIDLE上，这样你就可以看一看了。按钮始终居中（水平和垂直）很重要，因为这必须是移动响应页面

</div><div id="container"><div id="left">

取消 证实

外观：

它应该是什么样子：

---

非常感谢各位

如果您可以在项目中使用

flexbox

，那么这个（）可能会对您有所帮助

基本上，我所做的就是将

display:flex；

添加到您的

#容器中

，并为您的

#左

和

#右

分区提供50%的宽度和一些重新定义的边距

---

免责声明：某些移动设备可能存在flexbox问题。请查看您的项目要求并查看兼容性。看起来iOS 7.1及以上版本和Android 4.1及以上版本都支持flexbox。您正在浮动两个按钮。如果出现此问题，它们将从正常内容流中删除。至于您的灰色容器担心它们不会占用任何空间

要解决这个问题，您需要添加一个被称为clearfix的东西，您的灰色容器可以响应它们，就像它们不是浮动的一样，也就是说，占用容器中的空间

我喜欢这个

.cf:before，
.cf：之后{
内容：；/*1*/
显示：表格；/*2*/
}
.cf：之后{
明确：两者皆有；
}

将上面的clearfix添加到您的

#容器中



签出更新的JSFIDLE：

这是一个例子

我会让你摆弄适当的比例、填充、边距等。
也许是这样