How to make a rubber block with rubber pictures inside?

Question

css

Good evening), there is such a plate with icons jsfiddle.net/w4Lpe4co
How to make the pictures and the plate itself shrink when the browser window is shrunk, and also the indents between the pictures
It is necessary to do something like here mobile.rsb.ru/.
Specifically interested in the following:

1. Why does my header not shrink in height when the screen is reduced, it shrinks on rsb :)
   
2. Why are the pictures not shrinking? (about inserting through img, do not say anything and do not offer :)
   
3. When you do adaptive-fluid layout, do heights and indents through% or em?
   
4. Is it possible to do so that when the browser window is reduced, the text is also scaled somehow, or only through mq to change it on a certain extension?
   

Answer 1

Use relative vh and vw units, which depend on the screen size.

Answer 2

Why does my header not shrink in height when the screen is reduced, it shrinks on rsb :)

Should I? The height is in em ...
Very interesting why? Usually they do this, it is very convenient.
Both are useful in moderation.
No, only via mq/js .