Нужно красные таблички перенести вниз
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title> дз2</title>
<link href="style.css" rel="stylesheet" type="text/css"/>
<script src="script.js>"></script>
</head>
<body>
<div class="BigBob">
<div class="tovar1">tovar1
<div class="buy1">buy1</div>
</div>
<div class="tovar2">tovar2
<div class="buy2">buy2</div>
</div>
<div class="tovar3">tovar3
<div class="buy3">buy3</div>
</div>
<div class="tovar4">tovar4
<div class="buy4">buy4</div>
</div>
<div class="tovar5">tovar5
<div class="buy5">buy5</div>
</div>
<div class="tovar6">tovar6
<div class="buy6">buy6</div>
</div>
</div>
</body>
</html>
CSS:
.BigBob{
background-color: antiquewhite;
display: flex;
align-items: flex-start;
width: 700px;
height: 450px;
justify-content:space-between;
flex-wrap: wrap;
}
.tovar1{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.tovar2{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.tovar3{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.tovar4{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.tovar5{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.tovar6{
background-color: rgb(226, 102, 89);
width: 198px;
height: 198px;
margin: 10px;
}
.buy1{
background-color: rgb(255, 0, 0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position:relative;
}
.buy2{
background-color: rgb(255,0,0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position: relative;
}
.buy3{
background-color: rgb(255,0,0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position: relative;
}
.buy4{
background-color: rgb(255,0,0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position: relative;
}
.buy5{
background-color: rgb(255,0,0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position: relative;
}
.buy6{
background-color: rgb(255,0,0);
width: 60px;
height: 30px;
margin: 10px;
align-content: flex-end;
left: 25%;
position: relative;
}
