Выпадание Div при уменьшении окна браузера. Есть задача выстроить по 3 блока в ряд, чтобы они резиновыми были. Проценты высчитала (сто раз уже проверила, чтобы не было лишних пикселей), выстроила, на весь экран работает,а при уменьшении окна браузера моментами не работает (см фото)
Методом тыка выяснила, что есть некая зависимость от наполнения в "длину", скажем так
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title> </title>
<link rel="stylesheet" href="style2.css">
</head>
<body style="width:100%; background-color:#445567; margin:0 auto;">
<section >
<div class="example clearfixf">
<div class="example_car mrg">
<img src="img/a.png" alt="Авто">
<p>Авто класса "Люкс" всегда должно блестеть именно так ярко!</p>
</div>
<div class="example_car mrg">
<img src="img/a.png" alt="Авто">
<p>КNtrcn ntrcn ntrcn nhtrdf gffee ggjklkl ffwsdedf ggg eee ffff!</p>
</div>
<div class="example_car thr mrg">
<img src="img/a.png" alt="Авто">
<p>Солидний автомобиль теперь буде солидним у каждой мелочи!</p>
</div>
<div class="example_car">
<img src="img/a.png" alt="Авто">
<p>ТNtrcn ntrcn ntrcn nhtrdf gffee ggjklkl ffwsdedf ggg eee ffff</p>
</div>
<div class="example_car">
<img src="img/a.png" alt="Авто">
<p>Ntrcn ntrcn ntrcn nhtrdf gffee ggjklkl ffwsdedf ggg eee ffff</p>
</div>
<div class="example_car thr">
<img src="img/a.png" alt="Авто">
<p>НNtrcn ntrcn ntrcn nhtrdf gffee ggjklkl ffwsdedf ggg eee ffff</p>
</div>
</div>
</section>
</body>
</html>
.motivation_car
{
background-color: #119999;
max-width:1168px;
width:auto;
height:135px;
margin:0 auto;
margin-bottom:70px;
}
.example
{
max-width:1168px;
width:auto;
height:1210px;
margin:0 auto;
background-color: #167899;
}
.example_car
{
width:32.87671232876712%;
background-color: #164999;
float:left;
margin-right:0.6849315068493151%;
margin-bottom:8px;
height:auto;
padding-right:0px;
vertical-align:top;
}
.thr
{margin-right:0;}
.example_car img
{
width:100%;
height:auto;
}
.example_car p
{ text-align: center;}
.mrg<img src="https://habrastorage.org/web/417/cc1/871/417cc1871fef47bc880e65cc8ca601d9.png" alt="image"/><img src="https://habrastorage.org/web/f42/2ec/17f/f422ec17f92a407c8c06e2e690e4690e.png" alt="image"/>
{margin-bottom:35px;}
