Html 当浏览器调整大小时，CSS创建的徽标背景将不对齐

我用css重新创建了一个徽标。这是一个相当简单的标志，一系列彩色条，上面有一个字母。字母在h1标记的范围内（使其变为白色）。该标志为ul标志，以li项目作为盒子。我使用z-index和position-absolute将其移到字母后面，在我的全屏幕上可以正常工作，但当浏览器变小时会变得不对齐。我曾尝试将父对象的位置设置为“相对”，但仍然存在相同的问题

我刚意识到图像有点不正确。徽标背景移动到span/h1之外，而不是父div。父div具有屏幕的全宽

.logo背景框{
显示：内联；
保证金：0；
浮动：左；
位置：绝对位置；
左：10.8%；
z指数：-1；
}








最小的

---

父div没有样式。

是否尝试添加以下CSS

div.logo {
    position: relative;
}

---

当您使用百分比作为测量工具时，样式会显示“使此内容从左侧具有总窗口大小的10.8%”，因此，如果窗口宽度为1000px，则从左侧的位置将为1000px的10.8%，因此每当窗口大小更改时，该位置都会更改。使用像素

px

而不是百分比

%

，它可以很好地工作

请提供一个工作示例。您的

位置：绝对

的整体意义是为元素提供一个绝对位置。如果你不想这样，那你为什么要具体说明呢？很抱歉，回复太晚了，你的回答没有解决问题，但让我找到了一个解决方案。谢谢

div.logo {
    position: relative;
}