2017年1月

CSS Safari Hack

这次的标题起得比较简单是因为起标题太难了。

故事要从我在 Element 里发现了一个 Bug 说起，实际上这是 Safari 的渲染问题：http://jsfiddle.net/erpf75ky/4/

实际上在新版也能够复现这个问题，只要是 Safari，屡试不爽。

我们发现是table-layout的问题，在动态添加的table-layout似乎存在了一些微妙的渲染问题，于是在 Safari 下添加一个 class 去修改table-layout的状态，改变一次设置值即可正确渲染。

然而，这样的 Hack 在大部分浏览器里是没有必要的，所以就想着试试加了一下 Safari 的 Hack：

 // Simple hack for Safari 9+
_::-webkit-:not(:root:root), .el-table.loading {
    .el-table__body, .el-table__header {
        table-layout: auto;
    }
}

参考：

is there a css hack for safari only NOT chrome?

并查集与渗漏问题

前两周的时候看到有人推荐https://www.coursera.org/learn/algorithms-part1/的算法课，正好基础也忘得差不多了，觉得也是应该复(yu)习(xi)一下了，普林斯顿的这个公开课确实不错。

好了，废话不多说，来总结一下第一周，说说并查集和渗漏问题吧。

数据结构介绍

并查集是一个处理连接问题的数据结构，可以用这个结构快速的找到两个元素是否属于同一集合（或者说连通），和图的连通算法不同的是它忽略了路径的概念，只需要结果。

- 阅读剩余部分 -

CSS 解决 Chrome 限制最小12px字号问题

在 PC 上，有的时候我们并不需要 Chrome 给我们限定 12px 的最小字号，可是我们也不可能强行要求用户人工设置一波（当年 CodeCademy 的 Bug 就是因为最小字号的问题），所以必须想办法。

旧版 Chrome 可以通过：-webkit-text-size-adjust:none来设置，但其实是利用了一个微小的 Bug，在新版已经修复了，此外，这种方法会导致全局的缩放失效，不够友好。

在新版中，可以用 scale 解决缩放的问题，但如果是：-webkit-transform: scale(0.75);，Safari 也在缩放范围内，有两个方法解决：

第一是所有的浏览器统一的使用缩放，在 12px 的基础上操作。

- 阅读剩余部分 -