css - 显示图像而不按下内容

Question

我正在使用购买的模板来开发网站，并且需要在页面上插入图像而不向下推内容。以下是我正在处理的页面的链接: http://www.onepropertyway.com/WorkOrder/default.aspx?woid=26&code=8lPRt3hxtg&vid=7

我最近添加了以下带有 Logo 的 div:

<div style="margin-left:-20px; display:inline; *zoom:1;text-align:center">
<img src="/uploads/logos/8_100h.gif">
</div>`

如您所见，页面内容正在被下推。我希望此图像出现在主绿色菜单和水平线之间的中间，而不向下推任何内容。我也尝试使用 z-index，但这也不起作用。我确信这对于经验丰富的 CSSer 来说非常简单，但不幸的是我不是!

这里是所需外观的链接: desired look

Answer 1

将此 css 赋予 imgContainer 类。

.imgContainer {
  height: 100px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  text-align: center;
  top: -23px;
}
.row_6 {      
   position: relative;
}