CodePen

HTML

            
              <form action="">
  <h3>Example Form</h3>
  <p>
    <label for="id">ID</label>
    <input id="rnd-id" type="text" />
    <button type="button" onclick="rndID()">ID me</button>
  </p>
  <p><label for="">Title</label><input type="text" /></p>
  <p><label for="">Year Published</label><input type="text" /></p>
</form>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              form {margin: 100px auto; width: 210px;}
form, label {display: block;}

p {position: relative;}
button {position: absolute; top: 24px; right: 48px;}

input {padding: 5px}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              function rndID() {
    var x = document.getElementById("rnd-id");
    var a = Math.floor((Math.random()*90000)+10000);
    
    x.value = "nov" + a;
}
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................