title: how to hide a vertical scroll bar when not needed
body: <p>I have a textarea which is contained in a div as I have jquery hint and wanted to use opacity without changing the border.
  There is a visible vertical scroll bar how I only want this displayed when I am typing in the text field and it goes beyond the container. I have tried overflow: auto; but does not work.</p>
  
  <p>Textfield:</p>
  
  <pre><code>&lt;label&gt;
      &lt;div id="name"&gt;
          &lt;textarea name="message" type="text" id="message"
              title="Enter Message Here"
              rows=9 cols=60 maxlength="2000"&gt;&lt;/textarea&gt;
      &lt;/div&gt;
  &lt;/label&gt;
  </code></pre>
  
  <p>Styles:</p>
  
  <pre><code>#name { 
      border: 1px solid #c810ca;
      width: 270px;
      height:159px;
      overflow: hidden; 
      position: relative;
      }
  
  #message {
      height: 400px;
      width: 235px;
      overflow: hidden;
      position: absolute;
  }
  </code></pre>