mettre une boule dans une boule css

Solutions on MaxInterview for mettre une boule dans une boule css by the best coders in the world

showing results for - "mettre une boule dans une boule css"
Frida
17 Oct 2016
1.ball {
2 display: inline-block;
3 width: 100%;
4 height: 100%;
5 margin: 0;
6 border-radius: 50%;
7 position: relative;
8 background: radial-gradient(circle at 50% 120%, #323232, #0a0a0a 80%, #000000 100%);
9}
10
11.ball:before {
12 content: “”;
13 position: absolute;
14 background: radial-gradient(circle at 50% 120%, rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0) 70%);
15 border-radius: 50%;
16 bottom: 2.5%;
17 left: 5%;
18 opacity: 0.6;
19 height: 100%;
20 width: 90%;
21 filter: blur(5px);
22 z-index: 2;
23}
24
25.ball:after {
26 content: “”;
27 width: 100%;
28 height: 100%;
29 position: absolute;
30 top: 5%;
31 left: 10%;
32 border-radius: 50%;
33 background: radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.8) 14%, rgba(255, 255, 255, 0) 24%);
34 transform: translateX(-80px) translateY(-90px) skewX(-20deg);
35 filter: blur(10px);
36}
37