title: Bordering div that contain added elements by Javascript
body: <p>Trying to make a border that surround all the elements, and this div should have a stander height and width in the first and if the element reached the length of it it should expands according to the number of the elements. </p>
  
  <pre><code>&lt;div id="contText" &gt;&lt;/div&gt;
  
  &lt;input id="send" type="button" value="Send" onclick="myFunction()"&gt;&lt;/input&gt;
  </code></pre>
  
  <h2>CSS</h2>
  
  <pre><code>         div#contText {
  
  text-align: center;
  top:30px;
  width:400px;
  height:300px;
  background-color:white;
  border:1px solid black;
          }
  </code></pre>
  
  <h2>Javascript</h2>
  
  <pre><code>function myFunction() {
    var para = document.createElement("P");
    var t = document.createTextNode("This is a paragraph.");
    para.appendChild(t);
    document.getElementById("contText").appendChild(para);
  }
  </code></pre>