有没有办法隐藏不适合其父 div 的 div？

Question

我正在使用可调整大小的网格 (gridstackjs)，我想在它溢出单元格时将文本隐藏在里面。 我已经用包含单元格 DIV 内文本的 DIV 完成了它。

我试过 css 和媒体查询，但找不到正确的方法。 有一张图：

谢谢，希望我解释了自己。

 .elemento { overflow: hidden; }.texto-elementos { text-align: center; font-weight: bold; color: white; text-shadow: 2px 2px #474747; overflow: hidden; }.iconoAlturas { margin-top: -22px; margin-right: 8px; float: right; }

 <div class="grid-stack-item-content elemento ui-draggable-handle"> <div class="mt-2 texto-elementos">U1001</div><div class="iconoAlturas"><i class="fas fa-layer-group"></i></div></div>

Answer 1

'overflow: hidden' 属性只会隐藏溢出的内容。 要在调整页面大小时隐藏元素，您需要使用“display: none”属性和媒体查询。

 @media only screen and (max-width:300px){
      .texto-elementos {
         display:none
      }
}

当屏幕宽度小于 300 像素时，这将隐藏您的文本元素。 我认为它会对你有所帮助。

Answer 2

在不起作用的标签上添加以下 CSS 样式

overflow: hidden

Answer 3

将媒体查询用于具有 display: none 属性的相应设备尺寸。

 @media only screen and (respective screen size){.[class] { display:none } }