CSS scaleY() function
- Previous Page CSS scaleX() function
- Next Page CSS sepia() function
- Go Up One Level CSS Function Reference Manual
Definition and usage
CSS scaleY()
function used for vertical scaling of elements.
scaleY()
function to increase or decrease the height of the element.
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); }
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); }
CSS syntax
scaleY(s)
Value | Description |
---|---|
s | Required. Specify the number for the height scaling vector. |
Technical details
Version: | CSS Transforms Module Level 1 |
---|
Browser support
The numbers in the table indicate the browser version that first fully supports this function.
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
1 | 12 | 3.5 | 3.1 | 10.5 |
Related pages
Tutorial:CSS 2D Transformation
Reference:CSS transform attribute
Reference:CSS scale property
Reference:CSS scale() function
Reference:CSS scale3d() function
Reference:CSS scaleX() function
- Previous Page CSS scaleX() function
- Next Page CSS sepia() function
- Go Up One Level CSS Function Reference Manual