| Home | Forums | Reviews | Guides | Newsgroups | Register | Search |
 |
| Thread Tools |
|
Guest
Posts: n/a
|
 [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> |
|
|
|
|||
|
|
| |
|
Guest
Posts: n/a
|
|
|
|
|
||
|
|
| |
|
Guest
Posts: n/a
|
|
|
|
|
||
|
Guest
Posts: n/a
|
|
|
|
|
||
|
Guest
Posts: n/a
|
On Aug 13, 2:17*am, "me" <m...@example.com> 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> That looks like a bug in both Chrome and Safari. To force a re-render, set its display to none momentarily, e.g. like this: <html><head> <script type="text/javascript"> function doit (that) { that.style.padding= (window.k=!window.k) ? '60px' : '20px'; that.style.display= "none"; setTimeout(function(){that.style.display= "";},0); } </script> </head> <body> <div style="width: 360px; background-color: orange;"> <div style="padding: 20px;" onclick="doit(this)"> <h1>dynamic padding test</h1> <p>click anywhere in this rectangle to toggle its padding from 20 to 60 pixels.</p> </div> </div> </body></html> HTH, -- Jorge. |
|
|
|
|
|||
|
Guest
Posts: n/a
|
"Jeremy J Starcher" <> wrote in message news:MAd9o.59113$... > On Fri, 13 Aug 2010 16:01:29 +0200, me wrote: > >> "Denis McMahon" <> wrote in message >> news:4c652997$0$8723$... >>> On 13/08/10 01:17, me wrote: >>>> Is there a better way to force Chrome to re-render the content of the >>>> DIV ? >>> >>> Yes. >>> Don't make changes that force the page to re-render. It's incredibly >>> annoying as a web site user to have content on a page jump around while >>> I'm looking at. >>> Rgds >>> Denis McMahon >> >> Well, I'm trying to add buttons to my page that will let the user set >> the font size and text width they find most comfortable to read. I don't >> think anyone will find the effect "incredibly annoying". In fact I'm >> hoping it will improve the user experience. > > This is recreating functionality that *already exists* in most modern > browsers. > > Leave the font at the default size or larger. Never make a font smaller > than the user's preference. > > It has been my experience that any document that needs text resizing > options is a poorly laid out document. > The thing is, this site has a lot of older users, some of which are probably not that familiar with changing zooming and font preferences in their browser, and I wanted to give them an easy way to have extra-large text, but only in the main text column, so that all the other navigation and photos and stuff stay the same; that way they don't have to scroll around to find things in a zoomed-in page that is larger than their browser window. Creating a page for an older or not-very-computer-literate audience is very difficult, because you can't rely on the users to know their way around their browser and other software; I found that out when I put some pdf's up for download Marc. |
|
|
|
|
|||
|
Guest
Posts: n/a
|
|
|
|
|
||
|
Guest
Posts: n/a
|
"Ry Nohryb" <> wrote in message
news:e9bf2585-5c9d-41f4-9880-... On Aug 13, 2:17 am, "me" <m...@example.com> wrote: >> Is there a better way to force Chrome to re-render the content of the DIV >> ? >(...)To force a re-render, set its display to none momentarily, (...) >HTH, >-- >Jorge. Thanks, I'll use that. I'll have a look and see whether I can have the script detect the bug, and only use the display trick when necessary. If anyone here is in the habit of reporting bugs to Chrome/Safari/WebKit, feel free to do so about this It'd be very practical if this were fixed.Marc. |
|
|
|
|
|||
|
Guest
Posts: n/a
|
me wrote on 13 aug 2010 in comp.lang.javascript:
> Thanks, I'll use that. I'll have a look and see whether I can have the > script detect the bug, and only use the display trick when necessary. > If anyone here is in the habit of reporting bugs to > Chrome/Safari/WebKit, feel free to do so about this It'd be very> practical if this were fixed. 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); -- Evertjan. The Netherlands. (Please change the x'es to dots in my emailaddress) |
|
|
|
|
|||
|
Guest
Posts: n/a
|
On Aug 13, 10:43*pm, "Evertjan." <exjxw.hannivo...@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"; } -- Jorge. |
|
|
|
|
|||
|
|
| |
|
| Thread Tools | |
|
|
Similar Threads
|
||||
| Thread | Thread Starter | Forum | Replies | Last Post |
| Re: How include a large array? | Edward A. Falk | C Programming | 1 | 04-04-2013 08:07 PM |
| Nike air force one, air force 1, air force one low cut, air force one | salewholeta@163.com | Digital Photography | 3 | 12-31-2008 04:29 PM |
| Nike Air Force Ones,Air Force One Air Force One-1 | lky52193@gmail.com | Computer Support | 0 | 01-17-2008 04:40 PM |
| Nike Air Force Ones,Air Force One Air Force One-1,25th anniversary | lky52112@gmail.com | Digital Photography | 0 | 01-15-2008 04:46 PM |
| Nike Air Force Ones,Air Force One Air Force One-1,25th anniversary | lky52112@gmail.com | Digital Photography | 0 | 01-15-2008 04:34 PM |
