html - 自动调整按钮大小以覆盖每个屏幕的 1/3

Question

我想让以下三个按钮拉伸(stretch)以覆盖我的网页的 100%，这样每个按钮大约占页面的 1/3，它们之间有一个小间隙。

提前致谢:)

<a style="padding: 6px 35px; background-color: #838383; color: #fff; text-transform: uppercase; letter-spacing: -.2px; text-decoration: none; font-family: helvetica,arial,sans-serif; border-radius: 2px; font-size: 12px;" href="http://www.my-url.com">BUTTON 1</a>
&nbsp;
<a style="padding: 6px 35px; background-color: #636363; color: #fff; text-transform: uppercase; letter-spacing: -.2px; text-decoration: none; font-family: helvetica,arial,sans-serif; border-radius: 2px; font-size: 12px;" href="http://www.my-url.com">BUTTON 2</a>
&nbsp;
<a style="padding: 6px 35px; background-color: #434343; color: #fff; text-transform: uppercase; letter-spacing: -.2px; text-decoration: none; font-family: helvetica,arial,sans-serif; border-radius: 2px; font-size: 12px;" href="http://www.my-url.com">BUTTON 3</a>

Answer 1

或者不使用 calc(更简单的版本)。这是更新的 fiddle http://jsfiddle.net/fk2naw3q/4/

a {
  float: left;
  width: 32.667%;
}
a + a{
  margin-left: 1%;
}