CSS perspective not working | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson
+ 4

CSS perspective not working

Iโ€™m not exactly sure that it is the perspective, but for some reason Iโ€™m not getting a 3D ... Iโ€™m using perspective: 1000px; and transform-style: preserve-3d; but it doesnโ€™t seem to be working. Anybody know y https://code.sololearn.com/WlCa8yeFbzKN/?ref=app

3rd Apr 2020, 6:40 AM
Ginfio
Ginfio - avatar
12 Answers
+ 6
The geometric body is flat, but it's moving in 3D...
3rd Apr 2020, 7:56 AM
Crash
Crash - avatar
+ 1
I think your output is very good
3rd Apr 2020, 6:43 AM
Shaxzoda Sherzodovna
Shaxzoda Sherzodovna - avatar
+ 1
Mirielle(20k XP Monthly till November [2020]) itโ€™s not really about the output. meaning... I see the output is putting something out there.. but I tried to make it 3d. by using perspective, and some transform[rotate]. But the output just looks flat _ not in a 3d form
3rd Apr 2020, 7:32 AM
Ginfio
Ginfio - avatar
+ 1
Did you resolve it ?
4th Apr 2020, 8:14 PM
๐ŸŽŠ ๐“ข๐“พ๐“น๐“ฎ๐“ป ๐““๐“ธ๐“ป๐“ฒ๐“ฝ๐“ช ๐ŸŽ‰
๐ŸŽŠ ๐“ข๐“พ๐“น๐“ฎ๐“ป ๐““๐“ธ๐“ป๐“ฒ๐“ฝ๐“ช ๐ŸŽ‰ - avatar
+ 1
Viktoria Belazerava Don't Spam in Q&A section by posting unnecessary off topic greetings!
4th Apr 2020, 11:07 PM
Crash
Crash - avatar
+ 1
apply perspective to the container apply transform-style to base apply transform to the svg you want to manipulate you only need one svg tag,
5th Apr 2020, 1:34 AM
Logomonic Learning
Logomonic Learning - avatar
0
You dont need respective
3rd Apr 2020, 6:44 AM
Shaxzoda Sherzodovna
Shaxzoda Sherzodovna - avatar
0
Shaxzoda Sherzodovna i want the output in 3d. so .. donโ€™t i need perspective
3rd Apr 2020, 6:45 AM
Ginfio
Ginfio - avatar
0
Maybe your device and or browser doesn't support 3d transform (if they are old, they may not support transform at all), because your code is running as expected (3d rotation) for me as for Mirielle(20k XP Monthly till November [2020]) and Crash ... You could test for that, by putting this js snippet in your js tab: addEventListener('load',function() { var f = getComputedStyle(document.body).perspective; alert( f ? 'perspective seems to be supported' : 'perperctive (and 3d transform at least) are not supported' ); });
3rd Apr 2020, 3:00 PM
visph
visph - avatar
4th Apr 2020, 10:13 PM
Ginfio
Ginfio - avatar
- 2
No
3rd Apr 2020, 6:46 AM
Shaxzoda Sherzodovna
Shaxzoda Sherzodovna - avatar
- 2
Hello
3rd Apr 2020, 8:14 PM
Belazerava Viktoria
Belazerava Viktoria - avatar