jQuery CSS rendering - 在Firefox中工作，而不是在Chrome中 [英] jQuery CSS rendering - works in Firefox, not in Chrome

问题描述

我使用jQuery滑块来调整包含段落文本的DIV的填充。当我在所有方面均等地增加填充时，它应该强制所包含的段落在一个更窄的列，在页面的中心。

这在Firefox，但在Chrome中，段宽度保持不变（即它们不会随着DIV的填充推进而变窄），因此将布局向右推。

I在此处重新创建了问题： jsfiddle.net/ms3Jd 。

有关如何强制Chrome刷新封闭段落的任何想法？

<我知道有办法强迫（或欺骗）Chrome
刷新/重绘/重新计算页面元素，但是，不知道怎么做
。任何想法？

取自这里：如何强制WebKit重绘/重绘以传播样式更改？

  sel.style.display ='none'; 
 sel.offsetHeight; //不需要存储这个任何地方，引用就够了
 sel.style.display ='block'; 
  

我在这里快速应用它，但你应该将它变成一个函数： http://jsfiddle.net/thirtydot/ms3Jd/5/

I'm using a jQuery slider to adjust the padding of a DIV containing paragraph text. As I increase the padding on all sides equally, it should force the enclosed paragraphs into an ever-narrower column, in the center of the page.

This works in Firefox, but in Chrome the paragraph widths remain constant (i.e. they don't become narrower as the DIV's padding pushes in on them), so pushing the layout to the right.

I've recreated the issue here: jsfiddle.net/ms3Jd. You can try it in Chrome and Firefox to see the difference.

Any ideas on how to force Chrome to refresh the enclosed paragraphs?

解决方案

I know there are ways to force (or trick) Chrome to refresh/redraw/recalcuate the page elements, but don't know how to do it. Any ideas?

Taken from here: How can I force WebKit to redraw/repaint to propagate style changes?

sel.style.display='none';
sel.offsetHeight; // no need to store this anywhere, the reference is enough
sel.style.display='block';

I quickly applied it here, but you should make it into a function: http://jsfiddle.net/thirtydot/ms3Jd/5/

这篇关于jQuery CSS rendering - 在Firefox中工作，而不是在Chrome中的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！