google chrome for mac positioning headache - css

Question

i am using FF as the main testing platform and Chrome (for Mac) as the secondary.
I just noticed that Chrome is showing ~20px off positioning for CSS. (just to be clear Chrome is showing the TEXTAREA ~20px down as compared to FF)
Also Chrome is not obeying the width CSS property for TEXTAREA.
Is it just me or everyone is having this problem? I thought IE was crazy.
TEXTAREA {
background-color: white;
border: #ccc 2px solid;
color: black;
font-family: calibri, helvetica, arial, verdana, ms sans serif;
padding: 10px;
font-size: 16pt;
font-weight: normal
min-width:320px;
min-height:138px;
max-height:138px;
resize: none;
}
Is there a solution??

Answer 1

I think it would help if you could show us your 'troublesome' page. Maybe make a copy and upload it to the web so we can give it a check?
Whatever the case, I'm sure it has something to do with more than just the textarea itself. Perhaps its one of the containing elements, a rule on a parent div or table td or who knows. Since it's a textarea, I'm pretty sure there's a form or submit of some type involved so yeah, please show us more of your code ;)
You might find this useful anyway so that you can edit your code individually for moz or chrome:
Gecko browsers (FIREFOX):
#-moz-document url-prefix() {
/* Gecko-specific CSS here */
}
WebKit browsers (CHROME, SAFARI):
#media screen and (-webkit-min-device-pixel-ratio:0) {
/* Webkit-specific CSS here */
}
Cheers

Answer 2

Different browsers have different defaults. Add the following to the top of your CSS file:
* {
margin: 0;
padding: 0;
}
Also, what doctype are you using? If XHTML then "TEXTAREA" needs to be lowercase.