顶部导航图标位于左侧

Question

我的网页的移动顶部导航图标显示在屏幕左侧(徽标旁边(，尽管其值为浮动右侧。然而，当我将浏览器缩小到平板电脑大小时，它会出现在右上角，应该在那里。

每个链接(包括导航图标(都有这样的类：

.topnavLink {
float: left;
display: block;
color: rgb(97, 198, 245);
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 20px;

我已经尝试过从图标中删除类，并在样式中添加float: right;。我的目标是保持它在右上角，无论屏幕大小(当然，除了桌面视图(。如果您想查看其他代码，请告诉我。

谢谢！

Answer 1

尝试使用display: inline;

.txt{
display: inline;
}

<p class="txt">hello</p>
<p class="txt">world</p>

Answer 2

.topnavLink {
display: flex;
justify-content: flex-end;
display: block;
color: rgb(97, 198, 245);
text-align: center;
padding: 14px 16px;
text-decoration: none;
font-size: 20px;
}

如果你想完全向右对齐，文本的居中对齐会导致右侧有很小的间隙，你也可以向右对齐如果您也共享html，可能会有父元素更改对齐方式，这会更好。