Question: "Simple" question that I can't find the answer to -- What does `-webkit-perspective` actually do mathematically? (I know the effect it has, it basically acts like a focal-length control) e.g. what does `-webkit-perspective: 500` mean?!?

I need to find the on-screen location of something that's been moved using, among other things, `-webkit-perspective`

Answer: 
[The CSS 3D Transforms Module](http://www.w3.org/TR/css3-3d-transforms/#transform-functions) working draft gives the following explanation:

> 
> **perspective(<number>)**
> 
> 
> specifies a perspective projection matrix. This matrix maps a viewing cube onto a pyramid whose base is infinitely far away from the
>  viewer and whose peak represents the viewer's position. The viewable
>  area is the region bounded by the four edges of the viewport (the
>  portion of the browser window used for rendering the webpage between
>  the viewer's position and a point at a distance of infinity from the
>  viewer). The depth, given as the parameter to the function, represents
>  the distance of the z=0 plane from the viewer. Lower values give a
>  more flattened pyramid and therefore a more pronounced perspective
>  effect. The value is given in pixels, so a value of 1000 gives a
>  moderate amount of foreshortening and a value of 200 gives an extreme
>  amount. The matrix is computed by starting with an identity matrix and
>  replacing the value at row 3, column 4 with the value -1/depth. The
>  value for depth must be greater than zero, otherwise the function is
>  invalid.
> 
> 
> 

This is something of a start, if not entirely clear. The first sentence leads me to believe [the perspective projection matrix article](http://en.wikipedia.org/wiki/3D_projection#Perspective_projection) on Wikipedia might be of some help, although in the comments on this post it is revealed there might be some slight differences between the CSS Working Group's conventions and those found in Wikipedia, so please check those out to save yourself a headache.
Check out <http://en.wikipedia.org/wiki/Perspective_projection#Diagram> 

After reading the previous comments and doing some research and testing I'm pretty sure this is correct. 

Notice that this is same for the Y coord too. 

Transformed X = Original X \* ( Perspective / ( Perspective - Z translation ) ) 

eg. 
Div is 500px wide 
Perspective is 10000px 
Transform is -5000px in Z direction

Transformed Width = 500 \* ( 10000 / ( 10000 - ( -5000 ) ) 
Transformed Width = 500 \* ( 10000 / 15000) = 500 \* (2/3) = 333px