Quizz time XXI Sololearn Challange

Question

i have write a web code in code playground.
it is a short animation using HTML and CSS only.

Question :
How to make CSS code shorter and still get the same result?

no javascript or jquery. just CSS.
You can change everything in CSS and HTML but the output must still the same.

the shortest code win.
Take your time, i'll mark the answer in 24 hour.

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

Answer 1

Here is my attempt to remove the duplicate code and use reusable classes and styles.

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

Answer 2

@Nikhil
Do you mean the shorthand property?

Answer 3

@MR Programmer
So far your code is the shortest. i didn't expect it can below 30 line. great job.

Answer 4

@Nikhil
then modified my code and post here.
take your time and make it as shortest as possible.

Answer 5

@Ashwani Kumar
i like the way you modify keyframes.

Answer 6

We can write the animations in one line :-
Eg:- animation:textAnimate 6s ease 0.5s;
Eg :- animation : imgAnimate 6s ease 4.5s

Answer 7

@MR Programmer Not a problem for me at all, if you still find a better way to do it. I will appreciate it. Even, I am thinking more on the lines of , can it be optimised more ?

Answer 8

[Update] Check the updated version of my code with all possible optimizations I can think of. Here, I rest my case 😀

Answer 9

I use the concept of Bootstrap multiple classes.

now the css code is only 77 lines
prev 200+ lines

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

Answer 10

@Ashwani i will not change my code and ready to lose -32 xp . thanks for correcting me . I forget it after coding.

Answer 11

I can explain how my css is small. what i remove and why.

Answer 12

if i am correct then please comment.

Answer 13

@Ashwani is correct I forget it.

Answer 14

@Ashwani thanks for giving me one more opportunity here is my code contains.
29 lines in css
@Ashwani css line 56

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

i am ready to lose don't worry.

Answer 15

try my new code ' fractal tree '

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