css - 图像被切出

我有以下代码：http://jsfiddle.net/arp8x/

如您所见，图像被剪切掉了。如果不取消标记功能，就无法使其完全显示。

<div id="wrapper-AddSensors_img">
   <img id="AddSensors_img" src="http://3011victor.com/downloads/floorplan.gif" />
</div>


#wrapper-AddSensors_img {
    position: relative;
}
#wrapper-AddSensors_img img, #wrapper .marker {
    position: absolute;
}
#wrapper-AddSensors_img img {
    top: 0;
    left: 0;
}
#wrapper-AddSensors_img .marker {
    z-index: 100;
}

最佳答案

http://jsfiddle.net/NkCPA/1/

我已经将这些行添加到样式表的末尾：

#wrapper-AddSensors_img > img:first-child {
    position: relative;
}

.swMain .stepContainer div.content {
    min-height: 300px;
    height: auto;
}

相对位置允许#wrapper和.content div获取img的高度。将.content height设置为auto可使浏览器为大图像计算正确的高度，因此您也可以将此代码与其他尺寸的图像一起使用。

关于css - 图像被切出，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/18145689/