CSS Add Content Between Links

sample code for apply style only for tablet, mobile, inserting cotent between links by css.

a example code of adding content seperater '|' between links and use media query apply style for width less than 1024px;

@media (max-width: 1024px){
    .my-footer ul li{
        display:inline;
    }

    .my-footer ul li a{
        margin-right:1px;
    }

    .my-footer ul > li > a::after{
        content: " | ";
    }

    .my-footer ul > li:last-child a::after{
        content: "";
    }
}

How it looks like