WebKit 在 Android 和 iOS 上的一个不一致的地方

字体的原因？

我觉得是字体不同，padding 可能不一样。

line-height的问题？

我在 OS X Chrome 上模拟了一下，也有同样的现象
UA: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/43.0.2357.65 Safari/537.36

我猜是因为
a.tab_current:link, a.tab_current:visited, a.tab_current:active {
font-size: 13px;
line-height: 16px;
}

Chrome 是上对齐，Safari 是中对齐？
我把 line-height 都改成 13px，就没有违和了

我一般都这样写，height:16px;line-height:16px;

用PS 画辅助线看了一下，，好像都是 14px(上方以分享创造底色背景边界为边界 ，下方已“不用”的那个横线为边界)，导师 那个 OpenShare 那个字那里稍微不同，大写 O S 都 是一样， 小写 因为字体问题 导致不一样。

我看出来就是这样，，错了勿喷

由于我现在手上现在没有Mac环境没进行测试，抱歉 @Livid

由于我现在手上现在没有Mac环境没法进行测试，抱歉 @Livid

是因为 lineheight, 一般这种问题, 都是从 line-height\vertical-align 入手解决.
( 刷新一下, 看到上面已经比我快找到答案了, 个赞. )

解决方案:
line-height: 1;
padding: 6px;

准确的来说标题应该写成 "Safari 和 Chrome 的一个表现不一致的地方"

1. Chrome/Chromium 28 开始引入 Blink布局引擎 替换 WebKit布局引擎
2. Android 4.4 开始 WebView 是基于 Chromium 33
3. Android 5 开始 WebView 是基于 Chromium 36
4. Safari 是基于 WebKit2 的
5. Blink 是 WebKit 的一个 fork

see https://developer.chrome.com/multidevice/webview/overview
see https://en.wikipedia.org/wiki/Blink_(layout_engine)
see https://en.wikipedia.org/wiki/Safari_(web_browser)

@Livid 快把导航栏上私藏的那个功能交出来～

@Livid 什么时候能把Gist的两个问题给fix了？

@Septembers 话说，现在正在和 @Kai 同学 FaceTime Audio 中协调这个问题的开发进度。

@Septembers 目前在 Mac 或者 PC 上可以有办法模拟 Android L 浏览器么？

@Livid 还有一个问题 由于V2EX没有"收藏回复"的功能
因此希望把"感谢"作为一种"收藏回复"的方式使用
进而希望增加一个"曾经感谢"的功能
谢谢

@Livid 抱歉，没有了解过

@Livid
UA 可以吗？
WebView UA: Mozilla/5.0 (Linux; Android 5.1.1; Nexus 5 Build/LMY48B; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/43.0.2357.65 Mobile Safari/537.36

@Livid 可以，用 Genymotion 即可。

@Livid 浏览器兼容性测试可以利用一些 web 服务，比如 https://www.browserstack.com

@Dreista 不过这么用虚拟机总觉得是小题大做……

@Livid 但是也有极个别情况，只能真机去测，比如微信内置浏览器、国产的一堆浏览器、小米各个版本的浏览器...

刚好补充个问题，发布新主题时内容部分字体~~

input textarea等会隔断font-family属性，所以建议在其中重新定义一次，或者inherit

@Livid 不需要模拟，使用 https://developer.chrome.com/devtools/docs/remote-debugging 更好一些。