Prev: best way to implement draggable looping carousel (kinda like Google Maps)
Next: How to force text re-render after padding change fromjavascript in Chrome?
From: David Mark on 13 Aug 2010 20:25
On Aug 13, 11:37 am, williamc <te...(a)williamc.com> wrote:
> On 8/12/2010 8:17 PM, me wrote:
>
>
>
>
>
> > :-)
>
> > [This is a Chrome-specific problem, but since their help forum is all
> > questions and
> > no answers, I thought I'd try and see if anyone here has any idea.]
>
> > When you change the left and right padding of a DIV from a javascript, you
> > would
> > expect the text elements inside it to be rendered and justified again;
> > indeed, this is
> > what IE and FF do; Chrome 5.0 however, does not. The text moves
> > horizontally,
> > but retains its width. (see the example below)
>
> > I have tried setting the right-padding before the left-padding, or setting
> > all four
> > padding values together, but to no avail. I could make an imperceptibly
> > small change
> > to the font size, but setting font size to 14.99px may have undesirable
> > side-effects.
> > Is there a better way to force Chrome to re-render the content of the DIV ?
>
> > Marc.
>
> > <HTML><BODY>
> > <DIV ID="MyContainer" STYLE="width: 360px; background-color: orange;">
> > <DIV ID="MyContent" STYLE="padding: 20px;" onclick="this.style.padding='20px
> > 60px';">
> > <H1>Dynamic Padding Test</H1>
> > <P>Click anywhere in this rectangle to change the left and right padding
> > from 20 to 60 pixels.</P>
> > </DIV></DIV>
> > </BODY></HTML>
>
> Don't know the answer to your question, but interestingly it's
> reproduced with...
>
> onclick="this.style.padding='20px 60px';this.style.width='240px';
>
> but not with...
>
> onclick="this.style.padding='20px 60px';this.style.width='239px';
>
> onclick="this.style.padding='20px 60px';this.style.width='241px';
>
> and other values which are *not* equal to the implicit width of your
> content. One of the ace browser scripters in here can no doubt tell you why.
>

No rational reason. Just a bug in Webkit that has been around for
years.
From: David Mark on 13 Aug 2010 20:26
On Aug 13, 5:25 pm, Ry Nohryb <jo...(a)jorgechamorro.com> wrote:
> On Aug 13, 10:43 pm, "Evertjan." <exjxw.hannivo...(a)interxnl.net>
> wrote:
>
>
>
> > Even better would be a DOM-command to refrain from re-rendering:
>
> > Window.render(false);
>
> > and one to start re-rendering [the default]:
>
> > Window.render(true);
>
> window.render= function render (a) {
>  if (a) {
>   if (!render.f) {
>    render.f= setTimeout(function () {
>     delete render.f;
>     document.body.style.display= "";
>    },0);
>   }
>  } else document.body.style.display= "none";
>
> }
>

Will you please stop posting examples that augment host objects? And
no, that's not a cue to start up with your "window is the global
object in browsers" nonsense.

Thanks!


First  |  Prev  | 
Pages: 1 2
Prev: best way to implement draggable looping carousel (kinda like Google Maps)
Next: How to force text re-render after padding change fromjavascript in Chrome?