Html 即使标题旁边有一个元素，我如何将标题居中？

我已经尝试了所有方法，但仍然找不到解决这个“问题”的方法

这是我的导航栏：

基本上，我希望“pixelizer.io”居中，但“登录/注册”阻止它这样做

如果我缩小按钮内的文本，则“pixelizer.io”将居中：

以下是HTML：

pixelizer.io
登录/注册

CSS（标题）：

nav>h1{
宽度：100%；
清楚:对,；
显示：内联；
保证金：0自动；
字号：3em；
}

CSS（按钮）：

#加入按钮{
浮动：对；
填充：7px；
}

代码笔：

这样就可以了：

nav{
位置：相对位置；
文本对齐：居中；
}
导航>h1{
显示：内联；
保证金：0自动；
字号：3em；
}
#连接按钮{
填充：7px；
位置：绝对位置；
右：0；
}

---

使按钮绝对定位将其从其同级布局的考虑中移除。

我给出了按钮绝对定位，然后为

创建了一个flex容器

nav{
宽度：100%；
显示器：flex；
证明内容：中心；
对齐项目：居中；
}
导航>h1{
文本对齐：居中；
左边距：自动；
右边距：自动；
字号：3em；
}
#连接按钮{
位置：绝对位置；
右：5px；
填充：7px；
}

pixelizer.io
登录/注册

如果您可以附加一个带有所需html/css的可见问题的codepen链接，这将很容易看到并帮助您解决问题。我刚刚用您给定的html/css创建了一个代码笔链接，但它似乎没有重现您面临的问题。@a我的缺点是：nav是一个块元素，所以它的宽度应为100%，那么我们是否需要明确提到宽度为100%的nav？不，似乎没有必要。正是在这里，您可以在代码笔中看到它。说到元素对齐，flexbox始终是我的首选。