将用户图标移动到引导程序导航菜单中的右侧

问题描述：

我正在使用Bootstrap创建导航菜单。当汉堡包菜单随着视口尺寸变小而出现时，我无法将用户图标（具有登录和注册为下拉菜单项）移动到右侧并保持在右侧。将用户图标移动到引导程序导航菜单中的右侧

如果有人能告诉我如何实现这一点，我将不胜感激。 HTML代码可以在下面的链接中找到。对不起，无法将代码粘贴到此处，因为我没有足够的点数来粘贴超过2个链接。

https://www.findtaxpro.com/content/img/menufix.html

感谢，丹

答

我假设你熟悉添加破发点，以你的CSS中@media screen如果不是，它基本上是一个声明，在什么精确width的东西应该开始米奥雅纳在你的屏幕上，在这种情况下，用户IMG需要从左向右走，在浏览器窗口的一定宽度：

/* when window is smaller than 500px, the icon will move from left to right */ 

@media screen and (max-width: 500px) { 
     .user-img { 
      width: 45px; 
      float: right; 
     } 
}

你可以设置你想何时无论max-width .user-img应该切换一侧。希望这可以帮助。

编辑： 从我所看到的，您的文档设置已经照顾到突破点。因此，您需要为您的.user-img课程添加float: right;。

.user-img { 
width: 45px; 
float: right; 
}

这使用户右边的图标时，菜单汉堡包的中间，虽然它偶尔切换时的视口变小。我可以忍受它。谢谢。我如何始终让用户图标保持在正确的位置。我在线添加了css，并且新的html代码在这里：https：//www.findtaxpro.com/content/img/menufix-1.html –

只需移动“”，以便它正好在'

'之上如果它帮助你，请不要忘记标记我的答案。 – Crashtor

嗨Crashtor，非常感谢您的时间。我尝试过这个。请参阅https://www.findtaxpro.com/content/img/menufix-2.html上的示例。现在当汉堡包菜单出现时，即使汉堡包菜单和用户图标同时存在空间，菜单也会变得过高。有什么建议么？ Dan –

答

添加

.user-img { 
    float:right 
}

的CSS可能有助于

我意识到我的答案是有点太一般了，在编辑 –

将用户图标移动到引导程序导航菜单中的右侧

相关推荐