table-footer-group and safari / 镀铬 / 移动式答案

【问题标题】：table-footer-group and safari / chrome / mobiletable-footer-group and safari / 镀铬 / 移动式
【发布时间】：2014-03-22 07:21:06
【问题描述】：

所以我有这样的容器设置：

<div>
<div class="left"></div>
<div class="right"></div>
</div>

左边的div是登录，右边的div是内容...

对于媒体查询，当浏览器变得足够小时，我希望左侧（登录）部分位于右侧（内容）div 的底部。

我尝试在 .right div 上使用 table-header-group 并在 .left 上使用 table-footer-group，它在 FF 中完美地在桌面浏览器上运行......但是在 chrome、safari 和 IE 中......包括 iphone 和 android 手机它根本不工作。

我的整个布局是基于需要第一个 div 低于移动布局的第二个 div...这是可能的，还是我必须重做网站的整个结构？

例如。 http://jsfiddle.net/VF6Hy/1/

编辑：如果纯 css 无法做到这一点，是否有 JS 选项将第二个 div 堆叠在第一个上方？

【问题讨论】：

标签： css mobile

【解决方案1】：

我通过向容器添加一个大的最小高度和位置：绝对到 .right div 和底部：0 在移动版本上将其放在底部来解决这个问题

【讨论】：