当浏览器缩放时图片显示不全,怎样解决?

Question

* {
    margin: 0;
    padding: 0;
    font-size: 12px;
}

#wrap {
    width: 100%;
    height: 1000px;
    margin: 0 auto;
}

.map {
    width: 100%;
    height: 100%;
    background: url(../images/rotk.jpg) no-repeat;
    position: relative;
    background-size:cover;
    background-size:100% auto;
}

由于想要图片宽度充满浏览器,所以设成了100%,而且图里面需要有小div定位,position需要为relative..然后用ctrl+滚轮 缩放浏览器就会变成这样.

尝试过删掉float,设置min-height和min-weigth.没有效果

background-size:cover,还是一样

background-size:100% 100%;图片高度会跟着缩小.由于宽度固定,看起来十分别扭

我想要缩放浏览器时,这张图片大小不变.请问可以实现吗?