title: Enable scroll in the text area
body: <p>I'm using a css class to disable a textarea on my web form.The issue that i'm facing is when the content is above a certain limit the text area scrolls and when i disable the text area using css, the scroll also disables.
  I only want the text area to disabled not the scroll.I want the whole data to be read only when in disabled mode.</p>
  
  <p>Here is the html code</p>
  
  <pre><code>&lt;div class="ast"&gt;
  &lt;div class="notEdit-overlay"&gt;&lt;/div&gt;
  &lt;textarea id="txtBiography" class="TextArea100Per"&gt;
      Harry Potter is a series of seven fantasy novels written by the British author J. K. Rowling. The books chronicle the adventures of a wizard, Harry Potter, and his friends Ronald Weasley and Hermione Granger, all of whom are students at Hogwarts School of Witchcraft and Wizardry. The main story arc concerns Harry's quest to overcome the Dark wizard Lord Voldemort, whose aims are to become immortal, conquer the wizarding world, subjugate non-magical people, and destroy all those who stand in his way, especially Harry Potter.
  Since the release of the first novel, Harry Potter and the Philosopher's Stone, on 30 June 1997, the books have gained immense popularity, critical acclaim and commercial success worldwide.[2] The series has also had some share of criticism, including concern for the increasingly dark tone. As of June 2011, the book series has sold about 450 million copies, making it the best-selling book series in history, and has been translated into 67 languages.[3][4] The last four books consecutively set records as the fastest-selling books in history.
  A series of many genres, including fantasy, coming of age, and the British school story (with elements of mystery, thriller, adventure, and romance), it has many cultural meanings and references.[5][6][7][8] According to Rowling, the main theme is death.[9] There are also many other themes in the series, such as prejudice and corruption.[10]
  The series was originally printed in English by two major publishers, Bloomsbury in the United Kingdom and Scholastic Press in the United States. The books have since been published by many publishers worldwide. The books, with the seventh book split into two parts, have been made into an eight-part film series by Warner Bros. Pictures, the highest-grossing film series of all time. The series also originated much tie-in merchandise, making the Harry Potter brand worth in excess of $15 billion.[11] Also, due to the success of the books and films, Harry Potter has been used for a theme park, The Wizarding World of Harry Potter in Universal Parks &amp; Resorts' Islands of Adventure.
  &lt;/textarea&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>And Here is the css class used</p>
  
  <pre><code>    .TextArea100Per
  {
      border: none;
      font: normal 15px/16px "HelveticaNeueLTCom45Light" , Georgia,serif;
      margin: 8px 0 15px 0;
      padding: 7px 4px 8px 10px;
      color: #6d6e71;
      width: 98.6%;
      height: 225px;
  }
  .notEdit-overlay
  {
      width: 1080px;
      height: 99%;
      left: 0px;
      background: red;
      position: absolute;
      opacity: 0;
      filter: alpha(opacity=1);
  }
  .ast{
      position: relative;
  }
  </code></pre>
  
  <p>And here is a link to <a href="http://jsfiddle.net/MDFuB/" rel="nofollow">jsfiddle</a></p>