css - 如何在2个流体柱上留出空间

我有2个按钮，每个按钮的宽度为50％。 （流体按钮）
如果我想在按钮之间留出10px的间距（固定宽度间距）
有什么简单的方法吗？

这是我的代码

<div class="btnWrap">
    <a href="#" class="btnGray">No</a>
    <a href="#" class="btnOrange" data-rel="back">Yes</a>
</div>

.btnWrap { text-align:center; overflow:hidden;  margin:0 auto;    }
.btnWrap .btnOrange { display:block; float:left; width:50%; height:36px;  }
.btnWrap .btnGray { display:block; float:left; width:50%; height:36px;  }

最佳答案

是：
http://jsfiddle.net/fJ73C/

.btnWrap { text-align:center; overflow:hidden;  margin:0 auto;    }
.btnWrap .btnOrange { display:block; float:left;  width:calc(50% - 5px); height:36px; background-color:orange; }
.btnWrap .btnGray { display:block; float:left; width:calc(50% - 5px); height:36px; background-color:gray;  }

.btnWrap a:nth-of-type(odd)
{
    margin-right: 5px;
}

.btnWrap a:nth-of-type(even)
{
    margin-left: 5px;
}

您可以使用calc(50% - 5px)将按钮宽度设置为50％减去5个像素（5 + 5 = 10）

然后在左侧按钮右侧设置5px的边距，在右侧左侧设置5px的边距。

关于css - 如何在2个流体柱上留出空间，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/23233232/