Question

I have created a hr tag with below style

  hr{   
     /* margin:5%; */
     height:10px;
     display:block;
  }​  

here is the fiddle
It is displayed properly. Occupying 100% width of the screen. But if I change the margin Dynamically through JavaScript Console. It is overflowing from screen. How can I make this auto adjustable based on margins.

Answer 1

Instead of:

document.getElementById('a').style.margin= "5%";

Try this:

document.getElementById('a').style.margin= "5px";