设置100% width/max-width后图片仍无响应式，谷歌Logo居中适配求助

你的问题出在硬编码的固定边距和绝对定位上：.Google类用了position: absolute + margin-left: 240px，这个值不会随屏幕宽度变化，导致设备宽度改变时Logo错位。

下面是两种简单的修复方案：

方案一：利用Flex布局实现自适应居中（推荐） #

修改父容器.searchsections和.Google的CSS，让父容器作为flex容器来控制子元素居中：

body {
  width: 100%;
  max-width: 100%;
  background-color: #202124;
  overflow: hidden;
  /* 新增：让body占满视口高度，确保布局空间充足 */
  min-height: 100vh;
  margin: 0;
}

/* 其他原有CSS保持不变，只修改以下部分 */
.searchsections {
  width: 100%;
  /* 让容器占满视口剩余高度，避免和导航栏重叠 */
  min-height: calc(100vh - 50px);
  display: flex;
  /* 水平居中 */
  justify-content: center;
  /* 控制Logo垂直位置 */
  align-items: flex-start;
  padding-top: 72px; /* 替代原固定margin-top，控制顶部间距 */
}

.Google {
  /* 去掉绝对定位和固定margin */
  position: static;
  margin: 0;
}

方案二：用绝对定位+transform实现居中 #

如果想保留绝对定位，可以用transform: translateX(-50%)实现水平自适应居中：

.searchsections {
  width: 100%;
  max-width: 100%;
  position: relative;
  /* 让容器占满视口高度 */
  min-height: calc(100vh - 50px);
}

.Google {
  position: absolute;
  top: 72px;
  /* 先让元素左边缘对齐容器中点 */
  left: 50%;
  /* 再向左偏移自身宽度的50%，实现整体居中 */
  transform: translateX(-50%);
  margin: 0;
}

额外优化：导航栏自适应调整 #

你的导航栏用了固定padding-right，小屏幕上可能错位，建议改成相对边距+flex布局：

.navbar {
  display: flex;
  position: absolute;
  top: 13px;
  right: 20px; /* 用相对边距替代固定padding-right */
  gap: 16px; /* 用gap控制元素间距，比word-spacing更可靠 */
  align-items: center;
}

.dots, .pfp {
  position: static; /* 去掉绝对定位，用flex布局控制位置 */
  margin: 0;
}

内容的提问来源于stack exchange，提问作者Vybez