Код:
<!--HTML-->
<div class="tweet-main">
<div class="tweet-name-1">
<img src="https://i.imgur.com/kJf016a.png" style="width: 30px; height: 25px; margin-top: 8px; margin-left: 10px;">
<p class="tweet-name-2">Вуди Вудпекер</p>
<br><p class="tweet-tweets">43545 Твит</p></div>
<!-- ЗДЕСЬ ШАПКА -->
<div class="tweet-pic" style="background-image: url(http://s3.uploads.ru/hBgUt.png);"></div>
<!-- ЗДЕСЬ АВА (любого размера с одинаковой шириной и высотой) -->
<div class="tweet-ava" style="background-image: url(http://sa.uploads.ru/X2w9Q.png);"></div>
<div class="tweet-table">
<p class="tweet-name-3">Вуди Вудпекер</p>
<br><p class="tweet-nick">@woody</p>
<br><p class="tweet-status">туктук</p>
<br><p class="tweet-info">
<img src="https://i.imgur.com/ijJWybC.png" style="width: 18px; height: 18px; padding: 0px 5px">Локация <img src="https://i.imgur.com/9LE6tM8.png" style="width: 18px; height: 18px; padding: 0px 5px;">Регистрация: месяц, 2000 г. <img src="https://i.imgur.com/ZcGcjYd.png" style="width: 18px; height: 18px; padding: 0px 5px">Дата рождения: 00, месяц </p>
<br><p class="tweet-follow"><span class="follow">19</span> читаемых <span class="follow">35</span> читателей</p></div>
<button class="tweet-button"><a href="#" style="color: #1da1f2;">Изменить профиль</a></button>
<div class="tweet-gallery">
<!-- ЗДЕСЬ СВОИ КАРТИНКИ (любого размера с одинаковой шириной и высотой) -->
<img src="http://s3.uploads.ru/Gc4nu.png"> <img src="http://s3.uploads.ru/Gc4nu.png"> <img src="http://s3.uploads.ru/Gc4nu.png">
<br><img src="http://s3.uploads.ru/Gc4nu.png"> <img src="http://s3.uploads.ru/Gc4nu.png"> <img src="http://s3.uploads.ru/Gc4nu.png">
<!-- -->
</div>
</div>
<style>
.tweet-main {
background-color: #fff;
width: 570px;
height: auto;
border-width: 1px;
border-style: solid;
border-color: #e6ecf0;
margin-left: 55px;
}
.tweet-pic {
width: 569.5px;
height: 157px;
margin-left: 0.5px;
}
.tweet-name-1 {
width: 569.5px;
height: 44.5px;
background-color: #fff;
margin-left: 0.5px;
margin-top: 0.5px;
}
.tweet-name-2 {
font-size: 15px;
font-family: "Segoe UI";
color: #000;
font-weight: bold;
line-height: 0.6;
text-align: center;
left: -195px;
top: -28px;
position: relative;
}
.tweet-tweets {
left: 55px;
top: -59px;
position: relative;
font-size: 11px;
font-family: "Segoe UI";
color: #b3b3b3;
line-height: 0.9;
text-align: left;
}
.tweet-ava {
background-color: #b3b3b3;
border: 3px solid #fff;
border-radius: 80px;
width: 140px;
height: 140px;
margin-top: -90px;
margin-left: 15px;
background-size: 100%;
}
.tweet-button {
width: 180px;
height: 40px;
border: 1px solid #1da1f2;
color: #1da1f2;
border-radius: 60px;
top: -302px;
left: 370px;
position: relative;
outline: none;
background-color: #fff;
}
.tweet-table {
width: 250px;
height: auto;
}
.tweet-gallery {
width: 260px;
height: 170px;
top: -295px;
left: 293px;
position: relative;
margin-bottom: -250px;
}
.tweet-gallery img {
width: 80px;
height: 80px;
border: 2px solid #fff;
background-size: 100%;
}
.tweet-name-3 {
font-size: 15px;
font-family: "Segoe UI";
color: #000;
font-weight: bold;
line-height: 0.6;
left: 25px;
position: relative;
text-align: left;
}
.tweet-nick {
font-size: 12px;
font-family: 'Ubuntu', sans-serif;
color: #9b9b9b;
line-height: 0.75;
font-weight: lighter;
left: 25px;
top: -30px;
position: relative;
}
.tweet-status {
font-size: 12px;
font-family: 'Roboto', sans-serif;
color: #000;
line-height: 0.75;
left: 25px;
top: -50px;
position: relative;
}
.tweet-info {
font-size: 13px;
font-family: "Segoe UI";
color: #b3b3b3;;
line-height: 0.75;
left: 20px;
top: -50px;
position: relative;
}
.tweet-follow {
font-size: 12px;
font-family: "Segoe UI";
color: #b3b3b3;;
line-height: 0.75;
left: 25px;
top: -50px;
position: relative;
}
.follow {
color: #000;
font-weight: bold;
}
@font-face {
font-family: "Ubuntu";
src: url("https://fonts.googleapis.com/css2?family=Ubuntu&display=swap") format("truetype");
font-style: normal;
font-weight: normal;
}
@font-face {
font-family: "Roboto";
src: url("https://fonts.googleapis.com/css2?family=Roboto:wght@300&display=swap") format("truetype");
font-style: normal;
font-weight: normal;
}
</style>- Подпись автора
















