How to mark up a block with the adaptive background?

59d13d290486d939493353.png

How to mark up such blocks adaptive? tried to impose blocks background do not want to adapt to the screen. What would you recommend?Below the blocks which made up the background

59d13db50cf62961024082.png
June 14th 19 at 20:56
2 answers
June 14th 19 at 20:58
Solution
My situation is different https://codepen.io/anon/pen/BwddXV - ian commented on June 14th 19 at 21:01
the point is that everything works only in pixels - ian commented on June 14th 19 at 21:04
well , of course you will have a different situation. You changed the layout, styles left the same.
You read about the basics though...
https://codepen.io/iamevg/pen/ZXJXpY - Howell commented on June 14th 19 at 21:07
But without the media queries still neoboytis - ian commented on June 14th 19 at 21:10
And you can throw again the example? and the this you deleted I see) - ian commented on June 14th 19 at 21:13
,
body, html
 height 100%

.wrapper
 display flex
 flex-direction column
 height 100%
 justify-content center

.rock
 display flex
 width 100%

.block
 background dodgerblue
 border-radius 15px
 20px margin
 min-height 300px;
 width 50%
- Howell commented on June 14th 19 at 21:16
June 14th 19 at 21:00
background-image: url('photo.jpg');
background-size: cover;

Find more questions by tags HTMLPugCSSSass