Safari和CSS媒体查询

我有这个桌面版的CSS：

div.bottomnav_table_left {
  width: 50%;
  margin-bottom: 10px;
  margin-right: 0px;
  margin-left: 0px;
  display: table-cell;
}
div.bottomnav_table_spacer {
  width: 10px;
  display: table-cell;
}
div.bottomnav_table_right {
  width: 50%;
  margin-bottom: 10px;
  margin-right: 0px;
  margin-left: 0px;
  display: table-cell;
}

这是一个小窗口版本的CSS：

  @media screen and (max-width: 700px) {
  div.bottomnav_table_left {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0px;
    margin-left: 0px;
    float: left;
  }
  div.bottomnav_table_spacer {
    display: none;
    width: 0px;
    height: 0px;
  }
  div.bottomnav_table_right {
    width: 100%;
    margin-bottom: 10px;
    margin-right: 0px;
    margin-left: 0px;
    float: left;
  }
  }

（我已经尝试将CSS代码示例限制在核心。我希望这是可以的。）

在IE、Opera、Chrome和FireFox上，我可以上下调整窗口大小，效果很好。但是，在Safari上，它将在初始大小上工作，但调整浏览器窗口的大小只工作一次

---

如果重新调整Safari的大小（例如从小到桌面再到小），它将不再工作。它不会将div放置在彼此的顶部，而是将它们水平放置在彼此相邻的位置。

您可以提供问题的HTML和/或实时链接吗？尝试使用display:table cell创建响应性布局时可能会出现问题。如果你想让一个div表现得像一个表单元格，你不应该期望它浮动或堆叠在彼此的上面。如果没有一个实例，很难判断。对于@Coop的第二个评论，我想他们已经知道了一些事情。对于OP：您是否尝试过在媒体查询中的那些元素上设置

display:inline

？@chipcullen我刚刚尝试过display:inline，但似乎没有任何区别。如果我不尽快解决问题，我将创建一个完整的实时示例。