<h2 class="no-num no-toc" id=draft-recommendation-—-date:-01-jan-1901>Draft Recommendation — 4 February 2009</h2>
<h2 class="no-num no-toc" id=draft-recommendation-—-date:-01-jan-1901>Draft Recommendation — 5 February 2009</h2>
<p>You can take part in this work. <a href=http://www.whatwg.org/mailing-list>Join the working group's discussion list.</a></p>
<p><strong>Web designers!</strong> We have a <a href=http://blog.whatwg.org/faq/>FAQ</a>, a <a href=http://forums.whatwg.org/>forum</a>, and a <a href=http://www.whatwg.org/mailing-list#help>help mailing list</a> for you!</p>
<dl><dt>Multiple-page version:</dt>
<p class=note>Basically, the dimension attributes can't be used to
stretch the image.</p>
<p>To parse the attributes, user agents must use the <a href=#rules-for-parsing-dimension-values>rules for
parsing dimension values</a>. This will return either an integer
length, a percentage value, or nothing. The user agent requirements
for processing the values obtained from parsing these attributes are
described <a href=#sizing-of-embedded-content title="sizing of embedded content">in the rendering
section</a><!-- XXX xref -->. If one of these attributes, when
parsing, returns no value, it must be treated, for the purposes of
those requirements, as if it was not specified.</p>
<p>The <dfn id=dom-dim-width title=dom-dim-width><code>width</code></dfn> and <dfn id=dom-dim-height title=dom-dim-height><code>height</code></dfn> DOM attributes on
the <code><a href=#the-iframe-element>iframe</a></code>, <code><a href=#the-embed-element>embed</a></code>, <code><a href=#the-object-element>object</a></code>,
and <code><a href=#video>video</a></code> elements must <a href=#reflect>reflect</a> the
respective content attributes of the same name.</p>
respective content attributes of the same name.</p> <!-- XXX check
that this is defined right in the face of percentages -->
elements that have corresponding <a href=#concept-cell title=concept-cell>cells</a> in the <a href=#concept-table title=concept-table>table</a> corresponding to the
<!-- <code>input</code> elements whose <code title="attr-input-type">type</code> attribute is in the <span title="attr-input-type-image">Image Button</span> state -->
<p>When an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state does not
<a href=#represents title=represents>represent</a> an image and the user
agent does not expect this to change, the element is expected to be
treated as a replaced element consisting of a button whose content
is the element's alternative text. The intrinsic dimensions of the
button are expected to be about one line in height and whatever
width is necessary to render the text on one line.</p>
<p>The icons mentioned above are expected to be relatively small so
as not to disrupt most text but be easily clickable, for instance 16
pixels by 16 pixels square, or 1em by 1em if the images are
scalable. The images are intended to indicate to the user that they
can be used to get to whatever options the UA provides for images,
and, where appropriate, are expected to provide access to the
context menu that would have come up if the user interacted with the
actual image.</p>
<hr><p>An <code><a href=#the-object-element>object</a></code> element that <a href=#represents>represents</a> an
image, plugin, or <a href=#nested-browsing-context>nested browsing context</a> is expected
to be treated as a replaced element. Other <code><a href=#the-object-element>object</a></code>
elements are expected to be treated as ordinary elements in the
rendering model.</p>
<hr><p>The <code><a href=#audio>audio</a></code> element, when it has a <code title=attr-media-controls><a href=#attr-media-controls>controls</a></code> attribute, is expected
to be treated as a replaced element about one line high, as wide as
is necessary to expose the user agent's user interface features.</p>
<hr><p>The following CSS rules are expected to apply:</p>
<p>When an <code><a href=#the-applet-element>applet</a></code>, <code><a href=#the-embed-element>embed</a></code>,
<code><a href=#the-iframe-element>iframe</a></code>, <code><a href=#the-img-element>img</a></code>, or <code><a href=#the-object-element>object</a></code>
element, or an <code><a href=#the-input-element>input</a></code> element whose <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute is in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state, has an
<code title=attr-dim-align>align</code> attribute whose value is
an <a href=#ascii-case-insensitive>ASCII case-insensitive</a> match for the string "<code title="">center</code>" or the string "<code title="">middle</code>", the user agent is expected to act as if the
element's 'vertical-align' property was set to a value that aligns
the vertical middle of the element with the parent element's
baseline.</p>
<p>The <code title=attr-dim-hspace>hspace</code> attribute of
<code><a href=#the-img-element>img</a></code>, or <code><a href=#the-object-element>object</a></code> elements, and
<code><a href=#the-input-element>input</a></code> elements with a <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state, <a href=#maps-to-the-dimension-property title="maps to the dimension property">maps to the dimension
properties</a> 'margin-left' and 'margin-right' on the
element.</p>
<p>The <code title=attr-dim-vspace>vspace</code> attribute of
<code><a href=#the-img-element>img</a></code>, or <code><a href=#the-object-element>object</a></code> elements, and
<code><a href=#the-input-element>input</a></code> elements with a <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state, <a href=#maps-to-the-dimension-property title="maps to the dimension property">maps to the dimension
properties</a> 'margin-top' and 'margin-bottom' on the
element.</p>
<p>When an <code><a href=#the-img-element>img</a></code> element, <code><a href=#the-object-element>object</a></code> element, or
<code><a href=#the-input-element>input</a></code> element with a <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state is contained
within a <a href=#hyperlink>hyperlink</a> and has a <code title=attr-dim-border>border</code> attribute whose value, when
parsed using the <a href=#rules-for-parsing-non-negative-integers>rules for parsing non-negative
integers</a>, is found to be a number greater than zero, the user
agent is expected to use the parsed value for eight
<a href=#presentational-hints>presentational hints</a>: four setting the parsed value as
a pixel length for the element's 'border-top-width',
'border-right-width', 'border-bottom-width', and 'border-left-width'
properties, and four setting the element's 'border-top-style',
'border-right-style', 'border-bottom-style', and 'border-left-style'
properties to the value 'solid'.</p>
<p>The <code title=attr-dim-width><a href=#attr-dim-width>width</a></code> and <code title=attr-dim-height><a href=#attr-dim-height>height</a></code> attributes on
<code><a href=#the-img-element>img</a></code>, <code><a href=#the-object-element>object</a></code> or <code><a href=#video>video</a></code>
elements, and <code><a href=#the-input-element>input</a></code> elements with a <code title=attr-input-type><a href=#attr-input-type>type</a></code> attribute in the <a href=#image-button-state title=attr-input-type-image>Image Button</a> state, <a href=#maps-to-the-pixel-length-property title="maps to the pixel length property">map to the dimension
properties</a> 'width' and 'height' on the element
respectively.</p>
<p class=XXX>Terms that need to be defined include: <dfn id=sizing-of-embedded-content>sizing
of embedded content</dfn></p>
<hr><p>The following CSS rules are expected to apply when the
<code>Document</code> is in <a href=#quirks-mode>quirks mode</a>:</p>
