I don''t think that this is a bug with prototype (the CSS box model
adds padding and borders onto the dimensions of a box.
The size of the box includes the 1px border on all sides, which would
explain the 502px width (500+1+1), although it doesn''t explain the
46px height.
On Mar 16, 9:48 am, Angelo Chen
<angelochen...-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org>
wrote:> Hi All,
>
> Help me understand this, my following code initially display a box
> with size 500px x 40px, when you click the link, clickMe() will clone
> the box''s position into a hidden div and make it visible, sort of
> replacing the existing box with a new one, it works, but the size is
> 502px x 46px, slightly bigger than the original, any idea why? Thanks.
>
> <html>
> <head>
> <title></title>
> <style type="text/css">
> #regBox { border: 1px solid #efefef; width:500px;}
> #msg { border: 1px solid #efefef;}
> .hidden {display:none;}
> </style>
>
> <script type="text/javascript"
src="prototype-1.6.0.2.js"></
> script>
>
> <script type="text/javascript">
>
> function clickMe() {
> var box = $(''regBox'');
> var msg = $(''msg'');
> Element.removeClassName(msg,"hidden");
> msg.update(''please wait...'')
> Element.clonePosition(msg, box);
> Element.addClassName(box,"hidden");
> }
>
> </script>
>
> </head>
> <body>
>
> <a href="#" onclick="clickMe()">Click
me</a><br/>
>
> <div id="msg"
class="hidden"> </div>
>
> <div id="regBox">
> <input type="text" id="name"
/><br/>
> <input type="submit" />
> </div>
>
> </body>
> </html>
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---