I’d like to achieve displaying none in the dom tree the parent div, but to keep the child div stil visualized by css only.
<div> // keep this div
<div> // with media query make this div dissapear
<div> // keep this div
</div>
</div>
</div>
2
Answers
If you make the second div "display : none;" in css is going to disapeer and therefore the third div too because its a inner part of the second, if you want just to not being visible just dont add any css to the second div and then it will look invisible, if you want to see a div you can add in his css "border: 1px solid red;" and you will see all of the space that div takes.
Setting
display: none
on the parent will prevent child elements from being displayed, and I don’t believe there’s any way around that, but thevisibility
property can be overridden by children, so settingvisibility: hidden
on the parent andvisibility: visible
on the child will make only the parent invisible. It will, however, still take up space in the DOM, but you may be able to play around with positioning and the box model to make it work for your use-case.