Box Image
Adding a custom border image to a textarea. This is better than using one static background image especially when dealing with responsive websites.
Adding a custom border image to a textarea. This is better than using one static background image especially when dealing with responsive websites.
<textarea rows="4" cols="20" name="" id="">Some text here</textarea>
<textarea rows="4" cols="20" name="" id="">Some text here</textarea>
body {
body {
background: #F5F5F5;
text-align: center;
padding: 20%;
}
textarea {
width: 70%;
padding: 10px;
font-size: 14px;
letter-spacing: 1px;
color: #666666;
border-width:6px 6px 6px 6px;
border-image:url(http://demo.fwpolice.com/orangecity/img/border-mask.png) 6 6 6 6 repeat;
border-image:url(http://demo.fwpolice.com/orangecity/img/border-mask.png) 6 6 6 6 repeat;
border-image:url(http://demo.fwpolice.com/orangecity/img/border-mask.png) 6 6 6 6 repeat;
}
textarea:focus {
background-color: #FEFEFE;
color: #FF6600;
outline-width: 0;
}