Web Design Forums

Rakan · 19-01-2006, 15:27

Hello all! It's been a while... so, Happy New Year! and all that...

I've finally got myself down with CSS... nowhere near most of you, but rockin' and rollin' nonetheless... but I need to understand something...

Why is it that setting a width for a textarea never comes out the value you set it? For example, if I have a textarea with a width of 496px, it's really 500px? Am I doing something wrong here? Also, I've noticed that the widths of the textarea differs in IE and FF...

This question came up when I tried to have a textarea of 500px width sit right above a div of width 500px with 1px borders on the left, right and bottom...

Thanks guys.

mike_m · 19-01-2006, 15:36

this may help: http://www.tantek.com/CSS/Examples/boxmodelhack.html

Rakan · 19-01-2006, 15:51

Thanks for the link, Mike, but that wasn't really where I was going...

Assuming none of my elements have borders, margins or paddings set... I have a textarea that's 500px, a div underneath it set at 500px - the textarea gets bloated to 504px in FF and about the same in IE. If I then make the textarea 496px, it comes out perfectly aligned in FF but still too long in IE.

See my trouble here? I figured maybe it's something specific to textareas or other inputs?

smallbeer · 19-01-2006, 16:08

but as mike implied, textareas have default borders. So the box model maybe what's causing the issue.

There shouldn't be differences in IE though unless your talking about IE5.x or are putting IE6 into quirks mode.

A link would help.

Rakan · 19-01-2006, 16:34

Thanks for the reply, smallbeer. I've been playing around with different options... I've tried setting the borders, padding and margins to 0px on all elements and it doesn't make any difference. I've been searching for more info and came across a post on another forum about this. The poster mentioned something about it being a font issue, because the fonts are slightly different in size from browser to browser. How acurate this idea is, I have no clue. Anyway, the post was incomplete so it didn't do much for me.

Btw, I was testing it on IE 6 with the default settings.

smallbeer · 19-01-2006, 17:33

it looks like they have default padding too.

http://www.massively.co.uk/textarea.html

Rakan · 19-01-2006, 19:35

Now it's working. Thanks, smallbeer. I guess I missed something along the way.

19-01-2006, 15:27	#1 (permalink)
Rakan Senior Member Join Date: Mar 2005 Posts: 567	CSS Sizing Issues Hello all! It's been a while... so, Happy New Year! and all that... I've finally got myself down with CSS... nowhere near most of you, but rockin' and rollin' nonetheless... but I need to understand something... Why is it that setting a width for a textarea never comes out the value you set it? For example, if I have a textarea with a width of 496px, it's really 500px? Am I doing something wrong here? Also, I've noticed that the widths of the textarea differs in IE and FF... This question came up when I tried to have a textarea of 500px width sit right above a div of width 500px with 1px borders on the left, right and bottom... Thanks guys.

19-01-2006, 15:36	#2 (permalink)
mike_m Work faster microphone .. Join Date: Feb 2003 Location: Cambridge, UK Posts: 1,709	this may help: http://www.tantek.com/CSS/Examples/boxmodelhack.html __________________

Thread Tools	Search this Thread
Show Printable Version Email this Page	Search this Thread: Advanced Search

19-01-2006, 15:51	#3 (permalink)
Rakan Senior Member Join Date: Mar 2005 Posts: 567	Thanks for the link, Mike, but that wasn't really where I was going... Assuming none of my elements have borders, margins or paddings set... I have a textarea that's 500px, a div underneath it set at 500px - the textarea gets bloated to 504px in FF and about the same in IE. If I then make the textarea 496px, it comes out perfectly aligned in FF but still too long in IE. See my trouble here? I figured maybe it's something specific to textareas or other inputs?

19-01-2006, 16:08	#4 (permalink)
smallbeer I Ain't Losing Any Sleep™ Join Date: Apr 2003 Posts: 5,200	but as mike implied, textareas have default borders. So the box model maybe what's causing the issue. There shouldn't be differences in IE though unless your talking about IE5.x or are putting IE6 into quirks mode. A link would help.

19-01-2006, 16:34	#5 (permalink)
Rakan Senior Member Join Date: Mar 2005 Posts: 567	Thanks for the reply, smallbeer. I've been playing around with different options... I've tried setting the borders, padding and margins to 0px on all elements and it doesn't make any difference. I've been searching for more info and came across a post on another forum about this. The poster mentioned something about it being a font issue, because the fonts are slightly different in size from browser to browser. How acurate this idea is, I have no clue. Anyway, the post was incomplete so it didn't do much for me. Btw, I was testing it on IE 6 with the default settings.

19-01-2006, 17:33	#6 (permalink)
smallbeer I Ain't Losing Any Sleep™ Join Date: Apr 2003 Posts: 5,200	it looks like they have default padding too. http://www.massively.co.uk/textarea.html

19-01-2006, 19:35	#7 (permalink)
Rakan Senior Member Join Date: Mar 2005 Posts: 567	Now it's working. Thanks, smallbeer. I guess I missed something along the way.

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)