扩展css div的问题答案

【问题标题】：problems with an expanding css div扩展css div的问题
【发布时间】：2017-03-18 05:15:30
【问题描述】：

我有在悬停事件时展开的图块，但它们部分被相邻的图块覆盖，我该如何解决这个问题？

css代码sn-p：

.tile {
  position: absolute;
  width: 86px;
  background-color: #000000;
  height: 86px;
  color: #fff;
  transition: 1s linear all;
  overflow: hidden;
}
.tile:hover {
  background-color: #333333;
  height: 172px;
  width: 172px;
}

这是我的小提琴的链接：https://jsfiddle.net/zjcfope1/

【问题讨论】：

标签： javascript html css onhover jsblocks

【解决方案1】：

将z-index 添加到磁贴类。看看这个更新的fiddle

.tile {
 position: absolute;
 width: 86px;
 background-color: #000000;
 height: 86px;
 color: #fff;
 transition: 1s linear all;
 overflow: hidden;
 z-index: -9999;
}

.tile:hover {
 background-color: #333333;
 height: 172px;
 width: 172px;
 z-index: 9999;
}

【讨论】：

【解决方案2】：

这是你想要的吗？试试这个。

.tile:hover {
background-color: #333333;
 height: 172px;`
  width: 172px;
z-index:1000;

}

【讨论】：