仅当宽度尺寸开始触摸徽标时，背景尺寸才包含徽标图像

Question

当调整页面的宽度尺寸时，我只希望徽标开始包含当徽标两侧没有剩余空间时，所以此时调整到页面的宽度。一定很容易！在小提琴示例中，似乎表现得像我想要的那样，但不是我自己的代码，它包含背景大小（徽标）的时间。

我希望徽标中心页面具有一个尺寸，并在页面宽度到达徽标的两端时调整大小。希望你能理解我的英语。

这里是：fiddle

#logo {
display: block;
background: url("http://cdn4.colorlib.com/wp/wp-content/uploads/sites/2/2014/02/Olympic-logo.png");
background-repeat: no-repeat;
background-position: center center;
background-color: white;
background-size: contain;
-webkit-background-size: contain;
-moz-background-size: contain;
-o-background-size: contain;
height: 30%;
top: 0;
left: 0;
margin: 0 auto;
padding: 0;
-index: -100;

}

任何人都可以帮我吗？

Answer 1

我通过使用样式标记中的css创建一个单独的html文件来检查代码，它不适用于IE，但使用Chrome和FF。