Как добавить значок в кнопку в framework7?

#html #css #html-framework-7

#HTML #css #html-framework-7

Вопрос:

Я новичок в framework7. Я пытаюсь вставить значок в элемент button. Я бы хотел установить значок слева от метки. Я частично достиг своей цели.

    <a class="button button-fill button-round button-small color-   gray" href="#"  id="add_field_button" style="float: left;"><i class="material-icons ">add_circles</i>Add</a>
  

Я разместил демо-версию здесь.

https://jsfiddle.net/ad72krqv/1/

Заранее благодарю вас

Комментарии:

1. Простое добавление icon в <i> список классов обеспечило выравнивание по вертикали, так что это только начало.

Ответ №1:

Добавьте этот CSS

 .button {
    display: flex;
    justify-content: center;
    align-items: center;
}
.button > i {
    width: 24px;
    margin-right: 5px;
}
  

Ссылка JSFiddle на рабочую демонстрацию