Question

我的网站设置如下：

<html lang="en">
  <body>
    <div id="container">
      <div id="contentainer">
         <img src="img/car.png" alt="car.png" syle="position: absolute; top:10px; left:-35px; ">
         <div id="contentLeftTop"> ... </div>
         <div id="contentRightTop"> ... </div>
         <div id="contentLeftBottom"> ... </div>
      </div>
    </div>
  </body>
</html>

与相关元素相关的CSS：

#container {
  position:relative;
  margin:auto;
  width:820px;
  overflow:hidden;
  z-index:-1;
}
#contentainer {
  position:relative;
  float:left;
  width:800px;
  background-color:#FFF;
  border:10px groove #999;
  border-radius:15px;
  z-index:1;
}

似乎正在发生的事情是由于父“容器”div的宽度限制而导致图像被截断，但它成功地重叠了“contentainer”div。我究竟做错了什么？我正试图将car.png粘贴到页面的前面。

先谢谢。

Answer 1

问题不在于宽度限制，overflow:hidden;的样式中为#container。根据定义，这意味着任何延伸到#container之外的东西都会被切断。

我的img元素不会与其父母的父div重叠？

1 个答案: