In some cases, if vertical-align: top; doesn't give you the result you want, you might need to manually adjust the positioning. One way to do this is to use a combination of position: relative; on the parent element and position: absolute; on the pseudo element. This way, the pseudo element will be positioned relative to the parent element.

Here's an example of how to do this:


.your-element {
    position: relative;
    font-size: 60px;
    line-height: 60px;
}

.your-element::after {
    content: "©";
    position: absolute;
    font-size: 20px;
    top: 0;
    left: 100%; /* this will place the symbol just after the text */
}

In this code, the parent element has position: relative; and the ::after pseudo-element has position: absolute;. This makes the top: 0; in the ::after ruleset position the pseudo-element at the top of the parent element. The left: 100%; is used to place the copyright symbol just after the text.

The line-height in the parent element is used to adjust the height of the line of text. This might need to be adjusted depending on the specifics of your text and layout.