CSS解决box-shadow被紧邻的元素遮挡 div被遮挡

CSS解决box-shadow被紧邻的元素遮挡 div被遮挡

如图所示 B 元素的边缘阴影被紧贴的AC元素遮挡
AC 元素使用相同的css class，B比AC多一个 selected class。
由于div的顺序不同，导致 B 的阴影被遮挡。

class selected 原代码：

.gantt_task_line.gantt_selected {
	box-shadow: 0 0 5px #299cb4;
}

修改为：

.gantt_task_line.gantt_selected {
	box-shadow: 0 0 5px #299cb4;
	z-index:1;
}

使用 z-index 属性将元素显示在最上层即可。
如果z-index 不起作用，可能是缺少了属性 position:absolute/ relative ;
建议按照以下步骤修改：
1.检查问题标签有没有position属性 有–> 改成absolute 没有–> 加上 position:absolute 属性
2.检查父类 父类有无设置 z-index
结果：

如果帮到你的话，记得给我点一个免费的赞👍，谢了

z-index 介绍 :
定义和用法
z-index 属性设置元素的堆叠顺序，如果为正数，则离用户更近，为负数则表示离用户更远.
(数字越大离用户越近)
注：元素可拥有负的 z-index 属性值。
注：Z-index 仅能在定位元素上奏效（position 属性值为 relative 或 absolute 或 fixed的对象

浏览器支持
所有主流浏览器都支持 z-index 属性。

IE 会有额外问题，具体可以查看
https://www.cnblogs.com/darren_code/archive/2012/03/05/z-index.html