html - 在 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