JSFiddle - React, Tailwind, and code Playground
by LuckyCat
HTML
<div class="wrapper">
<div class="member-block">
<div class="member-photo">
</div>
<div class="member-inner">
<div class="member-name">
marta
</div>
<div class="member-info">
Zdjęcia: 24 68 Znajomych 149 Obserwujących
</div>
</div>
</div>
</div>
CSS
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
body {
background: #fff;
}
.member-block {
/*display: flex;
align-items: center; */
}
.member-photo {
width: 200px;
height: 200px;
border-radius: 50%;
background: blue;
/*flex-shrink: 0;*/
float: left;
}
@media only screen and (max-width: 600px) {
.member-name::after {
/*flex-grow: 1;*/
/*flex-shrink: 0; */
content: "";
display: block;
width: 100%;
height: 1px;
clear: both;
}
}