Issues like https://bugs.webkit.org/show_bug.cgi?id=151864 keep happening because AFAIK we don't have any conventions/guidelines for setting z-index. Popover should always have the highest z-index. We need to search for "z-index" in all Web Inspector CSS files and convert them to some consistent values.
<rdar://problem/23796065>
Do you have such a scheme in mind? Sounds like something that you could document on the trac wiki for posterity, once we have agreed on something.
(In reply to comment #2) > Do you have such a scheme in mind? Sounds like something that you could > document on the trac wiki for posterity, once we have agreed on something. This is a technique I've used before with CSS preprocessors: https://css-tricks.com/handling-z-index/ For our case, I suggest to use CSS variables: --resizer: 128; /* Sidebar panels resizer */ --tooltip: 256; /* Complete suggestions, hover-over variable tooltips */ --popover: 512; /* Go to line number popover */ --glass-pane-for-drag: 1024; /* invisible overlay while dragging */ --uncaught-exception-sheet: 2048; And use them like so: popover.css: .popover { z-index: var(--popover); } We must never directly use z-index above 100 and use variables instead. z-index below 128 is fine. It's already used a several times in CodeMirror. div.CodeMirror-cursors { z-index: 3 /* Okay */ } .data-grid .resizer { z-index: 100 /* Not okay, should be var(--resizer) */ } .popover-resizer { z-index: calc(var(--popover) + var(--resizer)) /* Okay (a contrived example) */ } What do you think?
Can you use calc() like that?
(In reply to comment #4) > Can you use calc() like that? Yes, you can! http://jsbin.com/wihiqanuvo/edit?html,css,output
Created attachment 267072 [details] Patch
Created attachment 267073 [details] [Image] With the patch applied This fixes: Web Inspector: dashboard-switching arrow(s) are visually on top of debugger Popovers https://bugs.webkit.org/show_bug.cgi?id=151864
Comment on attachment 267072 [details] Patch Clearing flags on attachment: 267072 Committed r193913: <http://trac.webkit.org/changeset/193913>
All reviewed patches have been landed. Closing bug.
*** Bug 151864 has been marked as a duplicate of this bug. ***