Question

我有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;  }

Answer 1

是： 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的边距。

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

1 个答案: