CSS scaleY() function

Definition and usage

CSS scaleY() function used for vertical scaling of elements.

scaleY() function to increase or decrease the height of elements.

scaleY() function in transform used in the attribute.

Example

Example 1

Use scaleY() Scale the height of multiple <div> elements:

#myDiv1 {
  transform: scaleY(0.5);
}
#myDiv2 {
  transform: scaleY(70%);
}
#myDiv3 {
  transform: scaleY(1.1);
}

Try it yourself

Example 2

Use scaleY() Scale the height of the image:

#img1 {
  transform: scaleY(0.5);
}
#img2 {
  transform: scaleY(70%);
}
#img3 {
  transform: scaleY(-0.5);
}
#img4 {
  transform: scaleY(1.1);
}

Try it yourself

CSS syntax

scaleY(s)

Technical details

Browser support

The numbers in the table indicate the browser version that first fully supports this function.

Related pages

Tutorials:CSS 2D-transform

Referens:CSS transform egenskap

Referens:CSS scale egenskap

Referens:CSS scale() funktion

Referens:CSS scale3d() funktion

Referens:CSS scaleX() funktion