Dynamically added form elements lose their margins

👉 Whoa! Please note that this post is 16 years old. The views expressed within might have become outdated.

September 8, 2008

I stumbled upon an annoying bug today. When dynamically appending input fields to the DOM, their margins are not as you specified in their respective classes.

See this page for an example. The input fields with class “text” have a right margin of 50px.

When a similar input field is appended to the DOM, however, the style is not copied.

A cloneNode operation is successful, luckily.

I encountered this bug in both Safari and Firefox. Unfortunately, I haven’t had time to check in other browsers.

If you have a solution to this bug, or know more about it, please share it in the comments!