Click to return to the DHTML, HTML     
WIDTH Attribute | width P...     word-break Attribute | wo...     DHTML Properties    
Web Workshop  |  DHTML, HTML & CSS

width Attribute | width Property


Sets or retrieves the width of the object.

Syntax

HTML{ width: sWidth }
Scriptingobject.style.width [ = sWidth ]

Possible Values

sWidth String that specifies one of the following values:
autoDefault width of the object.
widthFloating-point number, followed by an absolute units designator (cm, mm, in, pt, pc, or px) or a relative units designator (em or ex). For more information about the supported length units, see CSS Length Units.
percentageInteger, followed by a %. The value is a percentage of the width of the parent object.

The property is read/write with a default value of auto; the cascading style sheets (CSS) attribute is not inherited.

Expressions can be used in place of the preceding value(s), as of Microsoft® Internet Explorer 5. For more information, see Dynamic Properties.

Remarks

If you specify the width property of an IMG, but not the height property, the resulting height of the IMG is sized proportionally to the specified width property and the actual height, in pixels, of the source image file. Consider the following example:

Dimensions of image in source file (pixels):100 X 50 (W X H)
Specified image width:2in
Specified image height:not specified
Resulting image width:2in
Resulting image height:1in ((50/100) * 2 inches)

If you specify the width property of an IMG, and the height and width of the image in the source file are identical, the height of the image matches the width.

If you specify the height property and the width property of an IMG, the resulting image dimensions match the height and width specified.

The width of a block object encompasses borderLeft, borderRight, paddingLeft, paddingRight, marginLeft, marginRight, and width—the sum of which equals the width of the parent's content.

Percentage values refer to the parent object's width. Negative values are not allowed.

To perform operations on the numeric value of this property, use pixelWidth or posWidth.

For more information about how to access the dimension and location of elements on the page through the document object model, see Measuring Element Dimension and Location.

Example

The following examples use the width attribute and the width property to change the width of the object.

This example uses an inline style sheet to set the width of an image.

Sample Code

<DIV STYLE="position:absolute;top:10px;left:10px;width=1in">
. . . </DIV>

This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.
Microsoft Internet Explorer

This example uses inline scripting to set the width of an image when an onclick event occurs.

<IMG SRC="sphere.jpg" onclick="this.style.width='1cm'"
    ondblclick="this.style.width=''">

This feature requires Internet Explorer 4.0 or later. Click the icon below to install the latest version. Then reload this page to view the sample.
Microsoft Internet Explorer

Applies To

[ Object Name ]
PlatformVersion
Win16:
Win32:
Mac:
Unix:
WinCE:
A, ACRONYM, ADDRESS, APPLET, AREA, B, BASE, BASEFONT, BIG, BLOCKQUOTE, BODY, BR, BUTTON, CAPTION, CENTER, CITE, CODE, COL, COLGROUP, COMMENT, currentStyle, custom, DD, DEL, DFN, DIR, DIV, DL, DT, EM, EMBED, FIELDSET, FONT, FORM, FRAME, FRAMESET, HEAD, Hn, HR, I, IFRAME, IMG, INPUT type=button, INPUT type=checkbox, INPUT type=file, INPUT type=image, INPUT type=password, INPUT type=radio, INPUT type=reset, INPUT type=submit, INPUT type=text, INS, KBD, LABEL, LEGEND, LI, LINK, MAP, MARQUEE, MENU, META, NEXTID, NOBR, OBJECT, OL, OPTION, P, PLAINTEXT, PRE, Q, RT, RUBY, runtimeStyle, S, SAMP, SCRIPT, SELECT, SMALL, SPAN, STRIKE, STRONG, style, SUB, SUP, TABLE, TBODY, TD, TEXTAREA, TFOOT, TH, THEAD, TITLE, TR, TT, U, UL, VAR


Back to topBack to top

Did you find this topic useful? Suggestions for other topics? Write us!

© 1999 Microsoft Corporation. All rights reserved. Terms of use.