TRANSFORM OBJECT DIMENSIONS

You can transform any type of block object in CSS3 using the new transform property allowing you to scale, skew, rotate, and translate objects:

.scale { transform: scale(xpercent, ypercent) }
.skew { transform: skew(xdegrees, ydegrees) }
.rotate { transform: rotate(degrees) }
.translate { transform: translate(xpos, ypos) }

The scale function is relatively simple. It will resize an object into a new width and height using xpercent and ypercent as a decimal value between 0 to 1. If only one value is defined, the browser scales the object proportionally.

The skew function changes the 2D perspective of the object by slanting it left or right by xdegrees and up or down byydegrees. You may specify only one value here, ...

Get HTML5: Your visual blueprint™ for designing rich web pages and applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.