How to stretch preloader from svg?

Question

css

Why when I set the length of the parent to 100% ( #preloader ) all the rects are stretched, but the transparent text with animation is not visible? What is the problem? In theory, all blocks should adjust to the height and width, but the result is 0. What am I doing wrong? Thanks in advance)

Answer 1

if I understood correctly. You want the preloader to be full screen height too.
firstly, for svg it is not enough to set height and width or fill in css, etc. Attributes play the main role, in your svg attributes max-height 100%, a rect 100px.
but this is still half the trouble, there is still a viewBox attribute - this also applies to sizes :).
I would do it if I knew what you need, but my advice to you is to read well about svg ....
I personally set up a gulp task that completely cleans the svg object attributes fil stroke width height and then after I add styles to it