*, *::before, *::after can it affect just one div and not the whole page code example

Example 1: css before is not working

.chart ul:after{
  content: "";
  border:1px solid #f30;
}

Example 2: how use befor after for image

/* for child  */

.custom_img:after {
    content: "";
    background-color: #2359cf;
    height: 400px;
    width: 70%;
    top: -15px;
    right: -6px;
    position: absolute;
    z-index: 999;
}