刚刚跟一丝旺旺上讨论过,符合标准的肯定是文字遮盖 input,标准上说: This property specifies rendering when inline content overflows its block container element. 因为float元素只影响line box,所以text-overflow这属性跟float就完全无关了。 然而我是认为这个设定相当有问题,从符合直觉的角度,一切文字都盛装在line box里 面,它的排版行为也基本都是和line box相关的,这里跳过line box莫名奇妙地去找外层 的block container,实在是非常诡异,而且我相信从应用场景上,也不会有人想要这 种float和文字重叠的排版,这样的use case根本就不存在。 所以我想更好的做法是调整整个text-overflow的策略,让它变成基于line box去描述的。 /寒泉(winter在公司的花名) 发件人: 一丝 <yiorsi@gmail.com> 日期: 2013年6月4日星期二 下午12:24 至: public-html-ig-zh <public-html-ig-zh@w3.org>, "www-style@w3.org" <www-style@w3.org>, "Tab Atkins Jr." <jackalmage@gmail.com> 主题: [css3-text-overflow] Question regarding float and text-overflow: ellipsis(float 和 text-overflow: ellipsis 的问题) 重发发件人: <public-html-ig-zh@w3.org> 重发日期: Tue, 4 Jun 2013 04:25:07 +0000 问题源于这个讨论: http://lists.w3.org/Archives/Public/www-style/2013Apr/0540.html 我写了一个测试用例:http://jsbin.com/afuxid/1/edit 得到如下结果: http://img02.taobaocdn.com/tps/i2/T1rgC1XANbXXbAUXjT-270-405.png 其中: Chrome,IE8-10 表现一致,文字不遮盖 input; Opera 与 Firefox 表现一致,文字遮盖 input; Firefox 21 在 input 获得焦点后省略号消失。 Webkit bug:https://bugs.webkit.org/show_bug.cgi?id=115746 Chromium bug:https://code.google.com/p/chromium/issues/detail?id=237078 Firefox bug:https://bugzilla.mozilla.org/show_bug.cgi?id=864759 那么到底哪一种才是符合标准的? text-overflow 规范:http://dev.w3.org/csswg/css-ui/#text-overflow0 以上 一丝Received on Tuesday, 4 June 2013 07:17:37 UTC
This archive was generated by hypermail 2.4.0 : Friday, 25 March 2022 10:08:30 UTC