-
Bug
-
Resolution: Fixed
-
Normal
-
Freshly, 8.5.0, 8.5.1
-
Security Level: Jimmy
-
None
-
problem verified in Chrome/FF/IE11/Edge
-
ZK 8.5.2 S1
-
None
Steps to Reproduce
run the attached example (smooth-frozen-overlap.zul) and use the horzontal scrollbar
Current Result
parts of the content overlap the frozen column
this happens for all 3 mesh widgets grid/listbox/tree
Expected Result
frozen columns should stay above the scrollable cells
Debug Info
the divs positioned relative/absolute overlap when scrolling to the left (and partially overlap for selected, hovered rows)
Root Cause
z-index on frozen cells has no effect without relative positioning
see: https://developer.mozilla.org/en-US/docs/Web/CSS/z-index
The z-index CSS property specifies the z-order of a positioned element and its descendants.
Workaround
adding "position: relative" to the cells and a lower "z-index:0" for the non-frozen cells works in this scenario
.z-treerow, .z-treecell, .z-row, .z-cell, .z-listitem, .z-listcell { position: relative; } .z-treecell:not(:first-child), .z-cell:not(:first-child), .z-listcell:not(:first-child) { z-index: 0; }