How to impose this?

5e4e57675778d309002061.jpeg
April 7th 20 at 16:05
3 answers
April 7th 20 at 16:07
Solution
@Nikko.Sawa, why empty img?
<div class="pic">
 <img src="">
 </div>


and why .parentbackground-size: 90% auto;
90%
a not 100%?

explain
please - keeley_Hammes commented on April 7th 20 at 16:10
@Nikko.Sawa, a normal , if I give
.wrapper {
 flex: 1.5;
}

and then leave as it was
.pic {
 flex: 1;
}


or 1.5 usually asked? - keeley_Hammes commented on April 7th 20 at 16:13
@keeley_Hammes, empty img in the code randomly appeared. it is not needed. 90%, not 100% because otherwise the piece of the background to come out in the corner at the bottom left. flex can specify fractional values is quite possible. More googling flex-grow.

To have some "in a row", you need to add .parent {overflow: hidden;} - Nikko.Sawa commented on April 7th 20 at 16:16
@Nikko.Sawa, thank you

so if I just take
<div class="pic">
 <img src="">
 </div>


the result will be different - keeley_Hammes commented on April 7th 20 at 16:19
@keeley_Hammes, <div class="pic"> it is impossible to remove. You can remove <img src=""> - Nikko.Sawa commented on April 7th 20 at 16:22
April 7th 20 at 16:09
Solution
Recently there was already a similar question, and the solutions are there, for example my version - using clip-path:

How to perform this effect with css?

April 7th 20 at 16:11

Find more questions by tags CSSHTMLLayout