Оформление текста, часть 2 / Испытание: психоделическая тень [9/26]

Курсы §25. Оформление текста с помощью CSS. Часть 2
1

Добрый день!
Вроде все правильно, но почему то нет 100%?

Мой код:
/*
Используемые цвета:

#7fdbff, #39cccc, #3d9970, #2ecc40, #01ff70, #ffdc00, #ff851b,
#ff4136, #f012be, #b10dc9
*/

html,
body {
min-width: 570px;
margin: 0;
font-size: 200px;
font-family: “Arial”, sans-serif;
font-weight: bold;
color: #ffffff;
background-color: #111111;
}

p {
margin: 0;
padding-top: 60px;
text-align: center;
}

span {
margin-left: 60px;
}

span:first-child{
margin: 0px;
}

span:first-child {
text-shadow:
5px -5px 0 #7fdbff,
10px -10px #39cccc,
15px -15px #3d9970,
20px -20px #2ecc40,
25px -25px #01ff70,
30px -30px #ffdc00,
35px -35px #ff851b,
40px -40px #ff4136,
45px -45px #f012be,
50px -50px #b10dc9;
transform: translate(-15px);
}
span:nth-child(2) {
text-shadow:
0 -5px 0 #7fdbff,
0 -10px #39cccc,
0 -15px #3d9970,
0 -20px #2ecc40,
0 -25px #01ff70,
0 -30px #ffdc00,
0 -35px #ff851b,
0 -40px #ff4136,
0 -45px #f012be,
0 -50px #b10dc9;
}
span:nth-child(3) {
text-shadow:
-5px -5px 0 #7fdbff,
-10px -10px #39cccc,
-15px -15px #3d9970,
-20px -20px #2ecc40,
-25px -25px #01ff70,
-30px -30px #ffdc00,
-35px -35px #ff851b,
-40px -40px #ff4136,
-45px -45px #f012be,
-50px -50px #b10dc9;
}

image
image.png1680×1050 241 KB

2

Исправьте кавычки в названии шрифта…

1 лайк
3

Спасибо, помогло!

4

ааа психодел :smiley:

психо-css 
html, 
body {
    min-width: 570px;
    margin: 0;
    font-size: 200px;
    font-family: "Arial", sans-serif;
    font-weight: bold;
    color: #ffffff;
    background-color: #111111;
}

p {
    margin: 0;
    padding-top: 60px;
    text-align: center;
}

span {
    margin-left: 60px;
}

span:first-child {
    margin-left: 0;
    text-shadow:
                5px -5px #7fdbff,
                10px -10px #39cccc,
                15px -15px #3d9970,
                20px -20px #2ecc40,
                25px -25px #01ff70,
                30px -30px #ffdc00,
                35px -35px #ff851b,
                40px -40px #ff4136,
                45px -45px #f012be,
                50px -50px #b10dc9;
}

span:nth-child(2) {
    text-shadow: 
                0 -5px #7fdbff,
                0 -10px #39cccc,
                0 -15px #3d9970,
                0 -20px #2ecc40,
                0 -25px #01ff70,
                0 -30px #ffdc00,
                0 -35px #ff851b,
                0 -40px #ff4136,
                0 -45px #f012be,
                0 -50px #b10dc9;
}

span:last-child {
    text-shadow: 
                -5px -5px #7fdbff,
                -10px -10px #39cccc,
                -15px -15px #3d9970,
                -20px -20px #2ecc40,
                -25px -25px #01ff70,
                -30px -30px #ffdc00,
                -35px -35px #ff851b,
                -40px -40px #ff4136,
                -45px -45px #f012be,
                -50px -50px #b10dc9;
}