DEV Community

Sekti Wicaksono
Sekti Wicaksono

Posted on

CSS Battle - #7 Leafy Trail

HTML

<div></div>
Enter fullscreen mode Exit fullscreen mode

CSS

  body {
    background: #0B2429;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  div {
    width: 150px;
    height: 150px;
    border-radius: 68%;
    border-top-right-radius: 0;
    border-bottom-left-radius: 0;
    background: #998235;

    position: relative;
  }

  div:after {
    position: absolute;
    content: '';
    width: inherit;
    height: inherit;
    border-radius: inherit;
    background: #F3AC3C;
    left: 50px;
  }

  div:before {
    position: absolute;
    content: '';
    width: inherit;
    height: inherit;
    border-radius: inherit;
    background: #1A4341;
    left: -50px;
    z-index: -1;
  }
Enter fullscreen mode Exit fullscreen mode

Top comments (0)