仅使用 wordpress 中的 custom.css 将标题的 1 项向右对齐

Question

我只想将标题中的 facebook 图片向右对齐。 我只能访问 wp-admin，并且可以使用 custom.css 来执行此操作。

链接到我的网站：http://test.projekt-tenis.pl/wordpress/

我的标题看起来像：

我想要做的就是将 facebook 图像的位置设置为右侧，并像我的徽标一样填充 60px：

为此，我使用谷歌：

但我找不到将此 facebook 按钮放在此容器右侧的解决方案。有人可以帮忙吗？当我尝试更改代码时，我的整个菜单总是会改变位置。

Answer 1

您可以使用 CSS 获取菜单的最后一个子项（最后一个 li）并将其浮动。将这些行放在您的 custom.css 中。

/* nth-last-child "-n" means to start from the end, "+3" mean until 3rd from the end. */
.primary-menu li:nth-last-child(-n+3) {
    float: right;
    padding-right: 60px;
}

显然，在调整浏览器大小时，您必须确保它是如何工作的。

编辑：更好的是按照我在 cmets 中的建议，在右侧的菜单元素中添加一个类：

1. 转到 WordPress 管理中的外观 > 菜单页面
2. 点击右上角的“屏幕选项”
3. 确保选中“CSS 类”
4. 展开要向右浮动的菜单项
5. 在“CSS 类（可选）”字段中输入一个类（例如：menu-right）。

然后在你的 css 中：

.primary-menu li.menu-right {
    float: right;
    padding-right: 60px;
}