Microsoft KB Archive/272315

= PRB: Size Attribute Does Not Control the Width of  Text Element =

Article ID: 272315

Article Last Modified on 5/12/2003

-

APPLIES TO


 * Microsoft Internet Explorer 4.0 128-Bit Edition
 * Microsoft Internet Explorer 4.01 Service Pack 2
 * Microsoft Internet Explorer 4.01 Service Pack 1
 * Microsoft Internet Explorer 4.01 Service Pack 2
 * Microsoft Internet Explorer 5.0
 * Microsoft Internet Explorer 5.01
 * Microsoft Internet Explorer (Programming) 5.01 SP1
 * Microsoft Internet Explorer 5.5

-



This article was previously published under Q272315



SYMPTOMS
When you use the size attribute to control the width of a textbox (



CAUSE
The size attribute specifies how many characters to display, not the overall width of the element. The width of the element is determined by a combination of the size attribute, font, and font size that are set by the page. If you do not specify the font, the default font that is selected for the browser is used to determine the width. Even if you specify the font and font size for the page, you cannot guarantee consistent widths, because different users may have different versions of the same font installed.



RESOLUTION
The best way to ensure the width of an input element is to specify the width of the element either in pixels:



or by a percentage:



NOTE: The percentage is relative to the container of the element.



Steps to Reproduce Behavior
  Paste the following HTML code in a new .htm file:   

function showWidth {     var str  = &quot;Input box width: &quot; + test.clientWidth + &quot;px.&quot;; str += &quot; Font: &quot; + test.currentStyle.fontFamily; alert(str); }

 



<INPUT id=&quot;test&quot; type=&quot;text&quot; size=&quot;10&quot; style=&quot;font-family:arial;font-size:10&quot;>

</BODY> </HTML> </li> <li>View the .htm page on multiple computers, and you will probably see different widths for the textbox from computer to computer.</li></ol>

<div class="references_section">