The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS divs overlapping & Z-Index

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #25481


    I have yet another question. I have an error tooltip, which its parent is ‘x’. ‘x’ has a sibling div (‘y’). The problem is that the tooltip gets cut when it reaches div ‘y’. (see image)The tooltip has a greater Z-Index, but as I understand it only applies in the parent.

    Is there a way to make the tooltip on top? (overflow property didn’t work).



    The red one is X and the one to the right is Y, right? The problem could be, that X and Y are floating left inside a wrapper div. If so, the z-index doesn’t work then, because z-index and float are contradictions. Z-Index is positioning by design, float is positioning by nature. No z-index without positioning.

    Without having tried myself, give these ideas a chance:

    1. Give X an overflow:display. May be Y is drifting to the right, I’m not sure.

    2. Give the tooltip itself an absolute positioning (X must be position:relative then) and a z-index that is higher than the z-index of the wrapper div. This works fine if the tooltip is a hover-event, I am not sure what will happen in your case.


    1. I guess you meant overflow: visible. right? It didn’t work
    2. My tooltip has already an absolute position. Adding a relative position to its parent didn’t work…

    I’ll try to look for other solutions, thanks anyway…

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.