CSS ::在 Safari 中位置未更新后

Question

我在 Safari 中遇到 CSS 问题。更改 html 元素的文本后，::after 的位置不会更新。

$('#view').text("Shorter text"); // does not update the position of the #view::after pseudo-element http://jsfiddle.net/cpdmLnw7/

但在 Chrome 和 Firefox 中完美运行。

知道为什么吗？

Answer 1

似乎只是 Safari 中的一个错误。如果您强制回流，它会自行修复。

例如根据中的建议：

    var span=$('#view');
    span.text("Changing text does not update").css("display","inline-block").height();
    span.css("display","inline");

对height() 的调用强制浏览器在样式更改后重新呈现跨度（以便它可以计算"new" 高度）。没有它，更新只会合并为一个，什么也不会发生。您可以使用零超时的 setTimeout(...) 实现类似的效果。

CSS ::after position not updating in Safari