Трансформируется img в flex блоке
Flexbox растягивает изображение до конца блока . Когда кнопки нет все отлично,потому что так изображение длиннее чем текстовый блок. Все решается если не давать изображению трансформироваться. Увы я такого свойства не знаю.-не доучил
<div class="container ourTeam">
<div class="title">
<h1>our team<span>.</span></h1>
<p>They are big but still friendly.</p>
</div>
<div class="items">
<div class="item">
<img src="img/png/Joey.png" alt="">
<div class="text">
<h3>joey</h3>
<h5>web developer</h5>
<p>Coffee lover. Always on bike. iPhone fan.</p>
<a href="#">more</a>
</div>
</div>
<div class="item">
<img src="img/png/Matt.png" alt="">
<div class="text">
<h3>Matt</h3>
<h5>web designer</h5>
<p>MTB Biker. Photoshop Master. Loving Father.</p>
<a href="#">more</a>
</div>
</div>
<div class="item">
<img src="img/png/Mike.png" alt="">
<div class="text">
<h3>Mike</h3>
<h5>copywriter</h5>
<p>Drummer. Soup lover. Beer Drinker. Cyclist.</p>
<a href="#">more</a>
</div>
</div>
</div>
</div>
css
.ourTeam {
margin-top: 100px;
margin-bottom: 36px;
}
.ourTeam h1 {
font-family: "Montserrat", sans-serif;
font-size: 32px;
font-weight: 700;
color: #314a5b;
text-transform: uppercase;
margin-bottom: 17px;
}
.ourTeam h1 span {
color: #fa5c65;
}
.ourTeam p {
font-size: 16px;
color: #9aa0ab;
font-weight: 400;
font-family: "Montserrat", sans-serif;
}
.ourTeam .items {
display: flex;
justify-content: space-between;
}
.ourTeam .item {
display: flex;
}
.ourTeam .item h3 {
margin-top: 10px;
margin-left: 15px;
font-family: "Montserrat", sans-serif;
font-weight: 700;
color: #314a5b;
text-transform: uppercase;
margin-bottom: 12px;
}
.ourTeam .item h5 {
font-family: "Open Sans", sans-serif;
color: #fa5c65;
font-size: 14px;
text-transform: capitalize;
margin-bottom: 15px;
}
.ourTeam .item p {
font-family: "Open Sans", sans-serif;
color: #9aa0ab;
width: 180px;
line-height: 20px;
}
.ourTeam .item a {
color: #fa5c65;
font-size: 14px;
text-transform: uppercase;
text-decoration: none;
float: right;
margin-top: 50px;
font-family: "Montserrat", sans-serif;
font-weight: 700;
}
