用溢出划分另一个div-Divoveranotherdivwithoverflow

作者：mobiledu2502852457 | 来源：互联网 | 2023-05-19 16:59

Iwanttodisplaysomekindoftooltipontheleftsideofthelongdiv(vertical).AndifIsetthe

I want to display some kind of tooltip on the left side of the long div(vertical). And if I set the parend div css to overflow-y:auto; then the child div is not displayed. Here is a fiddle of the problem https://jsfiddle.net/wrwvc6Lc/2/ try to remove the overflow-y:auto; prop and everything is fine. Is there a way to do so, as I need the overflow prop.

我想在长div(垂直)的左侧显示某种工具提示。如果我将parend div css设置为overflow-y:auto;然后不显示子div。这是一个问题的小提琴https://jsfiddle.net/wrwvc6Lc/2/尝试删除overflow-y:auto;道具,一切都很好。有没有办法这样做,因为我需要溢出道具。

#infoBox {
  z-index: 1200;
  width:160px;
  height:90%;
  position: absolute;
  top: 10px;
  right: 10px;
     
	  background-color:white;
    overflow-y:auto; /* REMOVE THIS */
    border:1px solid red
    }


Lorem Ipsum is simply dummy text.
Lorem Ipsum is simply dummy text.

Tooltip

UPD: I want that tooltip to be relative to the content inside the main infoBox div (3-4 text block with tooltip), so placing that tooltip out of the infobox is not ok.

enter image description here

1 个解决方案

#1

The thing you're trying to do here is not possible (correct me if I'm wrong). Because overflow: auto; is required to set the scrollbars. But overflow also has an other property that every element inside the div with overflow: auto; can't go outside this element and will be cut off from this element which is intended.

你想在这里做的事情是不可能的(如果我错了,请纠正我)。因为溢出:auto;需要设置滚动条。但溢出还有一个其他属性,div中的每个元素都有溢出:auto;不能超出这个元素,将被切断这个预期的元素。

Your concept can only work if you're not working with the overflow: auto; and you can't use scrollbars for this reason unfortunately.

你的概念只有在你没有使用溢出时才能工作:auto;不幸的是,你不能因此而使用滚动条。