CodePen

HTML

            
              
<textarea id="comment">Toffee ice cream powder gummies oat cake cake. Liquorice bonbon tart danish cake pastry. Liquorice liquorice gummies marshmallow biscuit danish. Caramels lemon drops donut apple pie. Fruitcake dragée candy. Bear claw chocolate cake marzipan jelly-o candy canes croissant candy canes. Gingerbread croissant danish applicake powder sugar plum chupa chups sweet roll. Candy canes liquorice bear claw topping muffin brownie chocolate bar fruitcake chupa chups. Croissant cheesecake chocolate cake. Fruitcake candy canes fruitcake applicake muffin dessert macaroon. Tootsie roll chupa chups jelly-o macaroon pastry candy. Apple pie marshmallow sweet. Cookie wafer cake bonbon wafer. Toffee ice cream powder gummies oat cake cake. Liquorice bonbon tart danish cake pastry. Liquorice liquorice gummies marshmallow biscuit danish. Caramels lemon drops donut apple pie. Fruitcake dragée candy. Bear claw chocolate cake marzipan jelly-o candy canes croissant candy canes. Gingerbread croissant danish applicake powder sugar plum chupa chups sweet roll. Candy canes liquorice bear claw topping muffin brownie chocolate bar fruitcake chupa chups. Croissant cheesecake chocolate cake. Fruitcake candy canes fruitcake applicake muffin dessert macaroon. Tootsie roll chupa chups jelly-o macaroon pastry candy. Apple pie marshmallow sweet. Cookie wafer cake bonbon wafer.</textarea>
<div class="downOfTextarea"><p class="newCommentTip">Hey users you can use markdown</p></div>
            
          
!

↑ Insert the most common viewport meta tag

CSS

            
              /*text area*/
textarea#comment{ height: 128px; width: 827px; 
                  max-width: 827px; min-width: 827px; 
                  margin-left: 15px; overflow: auto; 
                  direction: rtl; padding: 6px 6px 6px 0; 
                  background-color: #F3D3AB; border: 1px solid #C58B23; 
                  border-top-left-radius:5px; 
                  -moz-border-top-left-radius:5px; 
                  -webkit-border-top-left-radius:5px; 
                  border-top-right-radius:5px; 
                  -moz-border-bottom-right-radius:5px; 
                  -webkit-border-top-right-radius:5px; }
textarea#comment:focus{ outline: none; }

/*bottom Of Textarea*/
.downOfTextarea       { width: 835px; margin-left: 15px; 
                        background-color: #8B5A38; 
                        color: #ffffff; height: 30px; 
                        margin-top: -25px; z-index: 1; 
                        line-height: 30px; position: relative; 
                        border-bottom-left-radius:5px; 
                        -moz-border-bottom-left-radius:5px; 
                        -webkit-border-bottom-left-radius:5px; 
                        border-bottom-right-radius:5px; 
                        -moz-border-bottom-right-radius:5px; 
                        -webkit-border-bottom-right-radius:5px; }
.newCommentTip         { margin-left: 7px; font-family: calibri, arial, tahoma; }

            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................