# Съезжает текст с иконки

**URL:** <https://forum.itvdn.com/t/sezzhaet-tekst-s-ikonki/2189>\
**Category:** HTML / CSS\
**Created:** [15.08.2018 16:58:57 UTC](https://forum.itvdn.com/t/sezzhaet-tekst-s-ikonki/2189 "2018-08-15T16:58:57Z")\
**Posts on this page:** 2\
**Page:** 1

<div class="post-metadata">

**Author:** ![mihail.fezin](https://forum.itvdn.com/letter_avatar_proxy/v4/letter/m/2acd7d/32.png) [@mihail.fezin](https://forum.itvdn.com/u/mihail.fezin)\
**Post date:** [15.08.2018 16:58:57 UTC](https://forum.itvdn.com/t/sezzhaet-tekst-s-ikonki/2189/1 "2018-08-15T16:58:57Z")

</div>

Подскажите что делать, как выровнять текст?

```
li {  
 background-color:orange;  
 color:white;  
 width:120px;  
 }  
 img {  
 width:24px;  
 height:24px;  
 }
```

```
\<li type="none"\>\<img src="https://cdn.icon-icons.com/icons2/936/PNG/128/volume-up-interface-symbol\_icon-icons.com\_73337.png" alt="Автозвук"\>Turn on
```

---

<div class="post-metadata">

**Author:** ![p3tr0ff.petor](https://forum.itvdn.com/letter_avatar_proxy/v4/letter/p/c67d28/32.png) [@p3tr0ff.petor](https://forum.itvdn.com/u/p3tr0ff.petor)\
**Post date:** [15.08.2018 17:20:19 UTC](https://forum.itvdn.com/t/sezzhaet-tekst-s-ikonki/2189/2 "2018-08-15T17:20:19Z")

</div>

Есть вариант flexом сделать:

```
li {  
 display:flex;  
 justify-content:center;  
 align-items:center;  
 background-color:orange;  
 color:black;  
 width:120px;  
 padding:5px;  
 }  
   
 img {  
 width:24px;  
 height:24px;  
 }
```

PS. белый текст на оранжевом выглядит не очень)