Показать изображение в строке с текстом в выпадающем меню Bootstrap

Question

У меня есть раскрывающееся меню в навигационной панели, где я хочу отобразить небольшой значок миниатюры рядом с текстом меню. Я могу заставить эту часть работать, но затем текст проходит через границу выпадающего списка. Я видел некоторые примеры показа шрифта - удивительный или глификон, встроенный рядом с гиперссылкой. Но никто не использует изображение, в котором изображение изменяется.

Использование Bootstrap 3.3.5. Вот ссылка на данную проблему: Bootply

Может кто-то пролить свет на то, как это исправить? Большое спасибо!

Answer 1

Попробуйте использовать это решение.

.dropdown-menu a.avatar img { 
    display: inline; 
    width: 20%; 
    height: 20%; 
} 

.dropdown-menu {min-width:300px} 

@media screen and (max-widht: 780px) { 
    dropdown-menu { 
     max-width:100% 
    } 
} 

Demo