<div class="container" style="display:flex;
flex-direction: row;
justify-content: left;
align-items: left;
display: flex;
margin-bottom: 25px;
margin-left: -45px;
flex-wrap: wrap;
">
<p> </p>
<div class="box" style=" width: 210px; height: 340px; display:flex; border-style: dotted; border-width: 1px; border-color: rgb(230, 230, 230); flex-direction: column; max-width: 25rem; min-width: 18rem; align-items: left; justify-content: left; margin: 0px;
text-align: left;"><a href="http://www.example.com/" style="text-align: center; top: 25px;"><img font-family:lucida="" sans="" src="/images/contentimages/images/Baby - Copy 2.png" style="width: 208px; height: 208px; display: block; margin: auto; position: relative; top: 10px;" /><strong><span style="font-size:20px;"><span style="font-family:lucida sans unicode,lucida grande,sans-serif;"></span></span></strong></a><strong></strong><br />
<span style="font-size:18px;"> Baby<a href="https://dummyimage.com/350x300/000/fff" style="color: rgb(116, 15, 110); text-align: center; top: 25px;"><span style="font-size: 18px;"> </span></a><span style="font-weight: bolder;"> <a class="btn btn-info btn-sm edatalayer order-1" data-list="product-listing-page" data-position="1" data-purl="custom-business-forms" href="http://www.example.com/">View details <i class="far fa-chevron-right pl-1"></i></a> </span></span></div>
<div class="box" style=" width: 210px; height: 340px; display:flex; border-style: dotted; border-width: 1px; border-color: rgb(230, 230, 230); flex-direction: column; max-width: 25rem; min-width: 18rem; align-items: left; justify-content: left; margin: 0px;
text-align: left;"><a href="http://www.example.com/" style="text-align: center; top: 25px;"><img font-family:lucida="" sans="" src="/images/contentimages/images/Birthday - Copy 5.png" style="width: 208px; height: 208px; display: block; margin: auto; position: relative; top: 10px;" /><strong><span style="font-size:20px;"><span style="font-family:lucida sans unicode,lucida grande,sans-serif;"></span></span></strong></a><strong></strong><br />
<span style="font-size:18px;"> Birthday<a href="https://dummyimage.com/350x300/000/fff" style="color: rgb(116, 15, 110); text-align: center; top: 25px;"><span style="font-size: 18px;"> </span></a><span style="font-weight: bolder;"> <a class="btn btn-info btn-sm edatalayer order-1" data-list="product-listing-page" data-position="1" data-purl="custom-business-forms" href="http://www.example.com/">View details <i class="far fa-chevron-right pl-1"></i></a> </span></span></div>
<div class="box" style=" width: 210px; height: 340px; display:flex; border-style: dotted; border-width: 1px; border-color: rgb(230, 230, 230); flex-direction: column; max-width: 25rem; min-width: 18rem; align-items: left; justify-content: left; margin: 0px;
text-align: left;"><a href="http://www.example.com/" style="text-align: center; top: 25px;"><img font-family:lucida="" sans="" src="/images/contentimages/images/Business_Greetings - Copy 3.png" style="width: 208px; height: 208px; display: block; margin: auto; position: relative; top: 10px;" /><strong><span style="font-size:20px;"><span style="font-family:lucida sans unicode,lucida grande,sans-serif;"></span></span></strong></a><strong></strong><br />
<span style="font-size:18px;"> Business Greetings<a href="https://dummyimage.com/350x300/000/fff" style="color: rgb(116, 15, 110); text-align: center; top: 25px;"><span style="font-size: 18px;"> </span></a><span style="font-weight: bolder;"> <a class="btn btn-info btn-sm edatalayer order-1" data-list="product-listing-page" data-position="1" data-purl="custom-business-forms" href="http://www.example.com/">View details <i class="far fa-chevron-right pl-1"></i></a> </span></span></div>
<p> </p>
</div>
我尝试重新调整 div 的宽度，但似乎这不是问题？
但是，当我删除 flex-wrap 选项时，第 3 个框与其他 2 个框回到同一行？