仅在响应式网格中的两个按钮之间留出边距（jquery mobile）

Question

我只想在 jquery mobile 中使用响应式网格在两个按钮之间留出一个空间，我不想在按钮的左侧和右侧留出空白。我不知道怎么做。

This jsfiddle 显示我想要的：当有水平空间时，左侧有一个按钮，右侧有另一个按钮，中间有一个空间。左侧按钮左侧没有边距，右侧按钮右侧也没有边距：完美！正是我想要的。

这就是我实现这个结果的方式：

.ui-grid-a [class*=ui-block-a]>.ui-btn { margin:0 10px 0 0; }
.ui-grid-a [class*=ui-block-b]>.ui-btn { margin:0 0 0 10px; }

但是......当我们挤压水平空间使其响应时，我将在第一个按钮的右侧有一个空格，在第二个按钮的左侧有一个空格（左右边距） CSS，当然）：

问题是：如何在按钮之间留出空间（如第一张图片），而在响应时没有空格（第二张图片中的问题）？在两个按钮之间使用某种“垫片”？另一个div？我真的尝试了很多东西......

Answer 1

使用这个 CSS：

@media (max-width:800px) {
  .ui-grid-a [class*=ui-block-]>.ui-btn {
    margin: 0;
  }
}

小提琴：http://jsfiddle.net/yu4pem1g/3/