SVG still showing when the container height is 0
hey folks I have some SVG which I encapsulated in a div now when I set my div height to 0 some SVG icons does not show as expected but some are still showing little bit
this is how I'm using them
https://mystb.in/EvaluatingImportDesigning
this is the code for one of the SVG which is not showing as expected
https://mystb.in/SimpsonsTheftHill
and this is the code of one of the SVG which is till showing when the container height is 0
https://mystb.in/SellsLiableGoing
MystBin - EvaluatingImportDesigning
This paste has (1) attached file(s)
MystBin - SimpsonsTheftHill
This paste has (1) attached file(s)
MystBin - SellsLiableGoing
This paste has (1) attached file(s)
3 Replies
Hi! Can you give a shot using
overflow-hidden
in your containers (div
)?
For more information you can take a look to this article: https://css-tricks.com/almanac/properties/o/overflow/#aa-visibleSara Cope
CSS-Tricks
overflow | CSS-Tricks
The overflow property controls what happens to content that breaks outside of its bounds: imagine a div in which you've explicitly set to be 200px wide, but
yeah that would work but still I not able to understand why some icons are not showing as expected and why are some till showing when the height is 0
height: 0 on parent won't affect svg inside it they will just overflow hence the provided solution of overflow: hidden