Reputation: 10084
This seems like a lack of understanding on my part. This SO question offers some insight but not exactly waht I'm trying to do.
I have a DIV which I want to shrink and reposition like a minimize effect. I am able to use scale to do this but it retains the original size for positioning (as expected) I want to detach the element instead.
.scales.tiny {
transform: scale(0.3);
-webkit-transform: scale(0.3);
-moz-transform: scale(0.3);
-ms-transform: scale(0.3);
}
I have a working jsbin that illistrates this.
How do I reposition / clip a scaled element in CSS?
Upvotes: 0
Views: 147
Reputation: 10786
You can use transform-origin
to lock the trasformation on the right and then add a translate to move it down:
.scales {
-webkit-transform-origin: 100% 100%;
}
.scales.tiny {
-moz-transform: scale(0.3) translateY(500px);
}
Upvotes: 2