Как сделать иконку на кнопке, перед названием кнопки?

Question

[Анатолий]

Как сделать кнопку с иконкой перед текстом, вот так:
"X Закрыть"

Накидал пример с иконкой после текста:

Кнопки имеют разную ширину, поэтому указывать абсолютное значение - не вариант.

PS. Интересно именно решение на CSS (без JS).

Answer 1

[Анатолий]

Обернул кнопку div и получил, что хотел.
Если есть еще варианты пишите.

Answer 2

[Programiker]

Вы через бэкроунд указывали так что естественно свг будет в конце
Попробуйте так

<input type="button" value="<div class="c"><svg version='1.1' xmlns='http://www.w3.org/2000/svg' x='0' y='0' viewBox='0 0 25 25' xml:space='preserve'%3E%3Cpath fill='none' stroke='%23222' stroke-linecap='round' stroke-miterlimit='10' d='M5 6l14 14M19 6L5 20'/%3E%3C/svg%3E"> Кнопка" id="a"><label for="a"></label>

Ну css сами понимаете - через Css :before

Comments

[Анатолий]

Честно говоря, не совсем понял мысль.
svg в коде - зло!

[Programiker]

На щёт свг извените
Ответ поправил

[Анатолий]

Programiker, а что изменилось в Вашем ответе?
Пример не рабочий, идея инлайн - не оптимальна!