Как настроить размер и позицию картинки в псевдоэлементе ::before?

Question

[Dude-1]

.authorization a::before {
 content: url(../images/user.svg);
 margin-right: 3px;
}

Прописал путь картинка отобразилась, но она большая и встала выше текста. Как задать ей размер и при желании позицию? Что надо добавить?

Answer 1

[Dymok]

Примерно так

.authorization a {
 position: relative;
}

.authorization a::before {
 content: '';
position:absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background: url(../images/user.svg);
 margin-right: 3px;
}

Comments

[Dude-1]

не работает
jsfiddle.net Здесь можешь проверить

[Dymok]

Dude-1, так нужна какая-то svg и более полный код, чем один селектор с псевдоэлементом

[Dude-1]

Что ты несешь? Я тебе говорю, что ничего не работает, прежде чем ответы писать, попробуй сам проверить.

[Dymok]

Dude-1, https://codepen.io/UnluckySerivelha/pen/oMJVqg

[Ankhena]

Dymok, display: inline-block и размеры для ссылки забыли, а то width и height по 100% для псевдо ни к чему не приведут

[Dymok]

Ankhena, будет размером с ссылку, более конкретной задачи не было

[Ankhena]

Dymok, Угу, только в вашем варианте картинка обрезается по верху