title: Disable resizing of textarea with SimpleMDE
body: <p>I'm using <code>SimpleMDE</code> as editor on my page. The code is the following:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"/&gt;
      &lt;meta name="description" content=""/&gt;
      &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"/&gt;
      &lt;link rel="shortcut icon" href="{% static 'img/favicon.png' %}"/&gt;
      &lt;link rel="stylesheet" href="{% static 'css/reset.css' %}"/&gt;
      &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"&gt;
      &lt;link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.12/css/all.css" integrity="sha384-G0fIWCsCzJIMAVNQPfjH08cyYaUtMwjJwqiRKxxE/rx96Uroj1BtIQ6MLJuheaO9" crossorigin="anonymous"&gt;
      &lt;link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css"&gt;
      &lt;link rel="stylesheet" href="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css"&gt;
      &lt;link rel="stylesheet" href="{% static 'css/fonts.css' %}"/&gt;
      &lt;link rel="stylesheet" href="{% static 'css/main.css' %}"/&gt;
      &lt;link rel="stylesheet" href="{% static 'css/media.css' %}"/&gt;
      &lt;link rel="stylesheet" href="{% static 'css/jquery.tagit.css' %}"/&gt;
      &lt;link rel="stylesheet" href="{% static 'css/tagit.ui-zendesk.css' %}"/&gt;
  
      &lt;script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"&gt;&lt;/script&gt;
      &lt;script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30=" crossorigin="anonymous"&gt;&lt;/script&gt;
      &lt;script src="https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.js"&gt;&lt;/script&gt;
      &lt;script src="{% static 'js/markjax.min.js' %}"&gt;&lt;/script&gt;
  
  
  &lt;/head&gt;
  &lt;body&gt;
  
      &lt;div class="main"&gt;
          &lt;div class="container"&gt;
              &lt;div class="main_content"&gt;
                  &lt;div class="row"&gt;
                      &lt;div class="main_page_content"&gt;
                          &lt;div class="wall"&gt;
                              &lt;div class="box_roundbox"&gt;
                                  &lt;div class="padd_box05"&gt;
                                      &lt;form method="post" id="task_create_form"&gt;
                                          Description:
                                          &lt;div class="padd_box_top1" name="description"&gt;
                                              &lt;textarea name="description" class="task_create_textarea"&gt;{{ task.description }}&lt;/textarea&gt;
                                          &lt;/div&gt;
  
                                      &lt;/form&gt;
                                  &lt;/div&gt;
                              &lt;/div&gt;
                          &lt;/div&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;script&gt;
  
          if ($(".task_create_textarea").length) {
              var task_create_textarea_mde = new SimpleMDE({ element : $(".task_create_textarea")[0], spellChecker: false, previewRender: function(plainText, preview) {
                    setTimeout(function() {
                      markjax(plainText, preview);
                    }, 50);
                    return preview.innerHTML;
                  } });
          }
      &lt;/script&gt;
  
  &lt;/body&gt;
  </code></pre>
  
  <p>CSS classes: </p>
  
  <pre><code>.main  {
      padding-top: 3em;
  }
  .row  {
      margin-left: 0;
      margin-right: 0;
  }
  .wall  {
      flex-basis: 0;
      flex-grow: 3;
      margin-right: 2em;
  }
  .box_roundbox  {
      border: 0.15em solid #AAAAAA;
      border-radius: 0.5em;
  }
  .padd_box05  {
      padding: 0.5em;
  }
  .padd_box_top1  {
      padding-top: 1em;
  }
  </code></pre>
  
  <p>My problem is: when I type really long strings in <code>textarea</code> generated by <code>SimpleMDE</code>, it just enlarges uncontrollably. How to disable horizontal resizing of <code>padd_box_top1</code>? I tried <code>resize: none;</code>, but nothing changed.  </p>