Search code examples
css3dperspective

CSS3 Second 3D Perspective

Hello guys I have a map like this http://sinanisler.com/demo/map/

and as you can see there is some trees but not true perspective ı want this http://sinanisler.com/demo/musteri/uploads/res.png Question is clear how can I do trees like that.

Solution

  • 1) Apply this style to the main div container to preserve 3d drawing of the children:

    [-webkit-/-moz-/...]transform-style: preserve-3d;

    2) Apply a rotation to the trees:

    [-webkit-/-moz-/...]transform: rotate3d(1, 0, 0,-90deg);

    3) Use a transparent background image for the trees