<form action="#" method="post">
      <h2> Vertical Only </h2>
      <textarea name="elem" id="elem" rows="5" cols="50" class="vert"></textarea>

      <h2> Horizontal Only </h2>
      <textarea name="elem" id="elem" rows="5" cols="50" class="horiz"></textarea>

      <h2> Both </h2>
      <textarea name="elem" id="elem" rows="5" cols="50" class="both"></textarea>

      <h2> No Resizing </h2>
      <textarea name="elem" id="elem" rows="5" cols="50" class="none"></textarea>
   </form>

body {
  margin: 50px auto;
  font-family: "Lato";
  font-weight: 300;
  width: 600px;
}

.both {
  resize: both;
}
.vert {
  resize: vertical;
}
.horiz {
  resize: horizontal;
}
.none {
  resize: none;
}