Rotating specified part of an element using 1 div tag or by using only 1 element!

Question

I have a cylindrical element which rotates about 90degree,can I rotate only specified part of the element to get transformed?

I'm the beginer to web languages and I just know basics of Javascript though, I would like to know the way to achieve it in CSS if not javascript.
Example:
Like tail of this dog gif
https://photos.app.goo.gl/E5Kc78FXEhW8uwLy9

Preferably I need with CSS, if possible!
Thanks.

https://code.sololearn.com/WFT2eQ6I45TY/?ref=app

Answer 1

Yes AZHAGESAN (Call Me Alex)
but not by splitting line I need entire specified elements part and another part should not get splitted it shoud be the part of that element only but, just it should be unchanged with its position.

Answer 2

Yeah! But it's by 6 div tags though this is what I needed exactly in output thanks a lot DAC 🎯 !!

Answer 3

Mirielle[ InAcTiVe ] okay !
Thanks for your answer:)

Answer 4

No,
Aakaanksha 💕 I have 1 element which rotates 90degree from left ,but I want the right half part of the element to be unchanged !
Like in L shape I need....
I don't know it can be whether achieved or not :)

Answer 5

That's okay Aakaanksha 💕 !
But thanks a lot for your efforts to help me;)

Answer 6

Aakaanksha 💕 What you did is right but the transformed part wont be curve right!
https://photos.app.goo.gl/E5Kc78FXEhW8uwLy9
Actually my doubt raised from here its a gif made with pure CSS

Answer 7

Chaithra Gowda👑
Hmm as far as i know transform part won't be curve 😅

But still I'm not too good in CSS! Maybe there should be a way! Others might help you.

Answer 8

I'm sorry but I don't understand what you trying to say by this:
"can I rotate only specified width of the element to get transformed?"

The width of the element is 190deg. did u mean you wanna to rotate it to the degree which is same as it's width. In this case 190?

Answer 9

Did you mean rotate specific part of the line. Like split the line?

Answer 10

Chaithra Gowda👑
I don't think you can split that single div.

What we can do is keep two separate parts and then animate only the left part.

Here have a look:
https://code.sololearn.com/W1v84lCYIXzn/?ref=app