最小宽度无响应背景的中心徽标

Question

我不得不设置一个min-width:1200px;背景图像来阻止它调整大小.如何使徽标保持响应？它应该保持在屏幕中间,不受背景不再响应的影响.

因此,徽标的父div不应该响应,而徽标应保持响应.我不能使用任何CSS框架,它是一个WordPress网站

Answer 1

如果你不能完成的logo另一容器内,它的直接父有min-width:1200px,你可以使用position:fixed上logo,并将其放置在页面上居中.

没有你的任何其他代码,这是解决方案

header {
  min-width:1200px;
  background:red;
  height:80px;
}
img {
  position:fixed;
  top:15px;
  left:50%;
  transform:translateX(-50%)
}
body {
  margin:0;
}

<header>
  <img src="http://via.placeholder.com/50x50">
</header>