Александр

Если вы хотите расположить картинку и текст в одной строке, можно воспользоваться свойством display: inline-block; для обоих элементов. Однако, как вы уже заметили, картинка может оказаться сверху текста.

Чтобы картинка была выровнена по вертикали с текстом, можно использовать свойство vertical-align и задать ему значение middle.

Пример кода:

<div>
<img src="icon.png" alt="icon" style="display: inline-block; vertical-align: middle;">
<a href="#" style="display: inline-block; vertical-align: middle;">Ссылка</a>
</div>

В этом примере мы создали контейнер div и добавили в него изображение и ссылку, оба с применением свойства display: inline-block; и vertical-align: middle;. Это помогает выровнять их по вертикали.

Вы также можете использовать другие способы выравнивания, такие как flexbox или grid. Например, вы можете создать контейнер с display: flex; и align-items: center;, чтобы выровнять элементы по вертикали.

Пример кода:

<div style="display: flex; align-items: center;">
<img src="icon.png" alt="icon">
<a href="#">Ссылка</a>
</div>

В этом примере мы создали контейнер с display: flex; и align-items: center;, чтобы выровнять изображение и ссылку по вертикали. Картинка и ссылка будут автоматически выровнены по центру контейнера.

Источник https://aie24.ru/states/kak-raspolozhit-kartinku-i...

Привет,
в общем в целом интерфейс это не про "выглядеть", а про "работать".
Поэтому основная задача у дизайнеров это понять насколько удобно людям с интерфейсом работать, всё ли понятно, всё ли очевидно, всё ли предсказуемо.

Я бы посоветовал взять паттерны того же материал дизайна и их переиспользовать.
Это позволит сэкономить время на тактическом уровне и сфокусироваться на стратегическом: зачем и кому нужен ваш сервис, какие основные задачи должны быть решены и для чего.

Вам на 4pda - там есть все инструкции по прошивке.