height

The height attribute defines the vertical length of an element in the user coordinate system.

You can use this attribute with the following SVG elements:

• <feBlend>
• <feColorMatrix>
• <feComponentTransfer>
• <feComposite>
• <feConvolveMatrix>
• <feDiffuseLighting>
• <feDisplacementMap>
• <feDropShadow>
• <feFlood>
• <feGaussianBlur>
• <feImage>
• <feMerge>
• <feMorphology>
• <feOffset>
• <feSpecularLighting>
• <feTile>
• <feTurbulence>
• <filter>
• <foreignObject>
• <image>
• <mask>
• <pattern>
• <rect>
• <svg>
• <use>

Example

html,
body,
svg {
  height: 100%;
}

<svg viewBox="0 0 300 100" xmlns="http://www.w3.org/2000/svg">
  <!-- With a height of 0 or less, nothing will be rendered -->
  <rect y="0" x="0" width="90" height="0" />
  <rect y="0" x="100" width="90" height="60" />
  <rect y="0" x="200" width="90" height="100%" />
</svg>

feBlend

For <feBlend>, height defines the vertical length for the rendering area of the primitive.

feColorMatrix

For <feColorMatrix>, height defines the vertical length for the rendering area of the primitive.

feComponentTransfer

For <feComponentTransfer>, height defines the vertical length for the rendering area of the primitive.

feComposite

For <feComposite>, height defines the vertical length for the rendering area of the primitive.

feConvolveMatrix

For <feConvolveMatrix>, height defines the vertical length for the rendering area of the primitive.

feDiffuseLighting

For <feDiffuseLighting>, height defines the vertical length for the rendering area of the primitive.

feDisplacementMap

For <feDisplacementMap>, height defines the vertical length for the rendering area of the primitive.

feDropShadow

For <feDropShadow>, height defines the vertical length for the rendering area of the primitive.

feFlood

For <feFlood>, height defines the vertical length for the rendering area of the primitive.

feGaussianBlur

For <feGaussianBlur>, height defines the vertical length for the rendering area of the primitive.

feImage

For <feImage>, height defines the vertical length for the rendering area of the primitive.

feMerge

For <feMerge>, height defines the vertical length for the rendering area of the primitive.

feMorphology

For <feMorphology>, height defines the vertical length for the rendering area of the primitive.

feOffset

For <feOffset>, height defines the vertical length for the rendering area of the primitive.

feSpecularLighting

For <feSpecularLighting>, height defines the vertical length for the rendering area of the primitive.

feTile

For <feTile>, height defines the vertical length for the rendering area of the primitive.

feTurbulence

For <feTurbulence>, height defines the vertical length for the rendering area of the primitive.

filter

For <filter>, height defines the vertical length for the rendering area of the filter.

foreignObject

For <foreignObject>, height defines the vertical length for the rendering area for the referenced document.

image

For <image>, height defines the vertical length for the image.

mask

For <mask>, height defines the vertical length of its area of effect. The exact effect of this attribute is influenced by the maskUnits attribute.

pattern

For <pattern>, height defines the vertical length of the tile pattern. The exact effect of this attribute is influenced by the patternUnits and patternTransform attributes.

rect

For <rect>, height defines the vertical length for the rectangle.

svg

For <svg>, height defines the vertical length for the rendering area of the SVG viewport.

use

For <use>, height defines the vertical length for the referenced element.

Specifications

• Filter Effects Module Level 1
,
• Filter Effects Module Level 1
,
• CSS Masking Module Level 1
,
• Scalable Vector Graphics (SVG) 2
,
• Scalable Vector Graphics (SVG) 2

See also

• CSS height property