After examining the provided markup, I noticed that none of the browsers are keeping the textareas in the container. While this is not a major issue, it can be inconvenient. However, what's really bothering me is that no matter what I do, I can't seem to get rid of the bottom margin for the textarea specifically in Chrome. Any ideas on how to fix this?
If you want to take a look at everything in action, feel free to check out this fiddle: http://jsfiddle.net/radu/RYZUb/
Here's the markup:
<div id="wrap">
<textarea id="txtInput" rows="6" cols="20"></textarea>
<div id="test"></div>
</div>
CSS:
#wrap
{
background-color:green;
height:210px;
width:440px;
}
#txtInput
{
height:100px;
width:100%;
margin:0px;
padding:0px;
}
#test
{
background-color:gray;
height:100px;
width:100%;
margin:0;
padding:0;
}