我有一个专辑缩略图的网格页面，2列和3行。然而，在第三行，我遇到了对齐行中两个项目的问题......
我一直试图在this page上的每个专辑缩略图之后插入一个css中断...例如在相册之间插入一个似乎修复了第三行中的错位问题...即插入br清除所有在drupal页面的php tpl中，例如在第五张专辑拇指上：
<br clear="all">
<div data-thmr="thmr_223" class="break-media node node-media-gallery node-teaser mg-gallery mg-teaser clearfix" id="node-136">
<h4><a href="/gallery/philippine-development-forum-on-bangsamoro-davao-city-november-5-and-6-2014">The Philippine Development Forum on the Bangsamoro, Davao City, November 5 and 6, 2014</a></h4>
<div data-thmr="thmr_227" class="media-collection-item-wrapper media-gallery-draggable-processed draggable"><div class="draggable-wrapper"><a class="draggable-handle">Drag</a></div><img src="/sites/all/modules/media_gallery/images/stack_bg.png" class="stack-image"><div data-thmr="thmr_231" class="media-gallery-item"><div class="top"><div class="top-inset-1"><div class="top-inset-2"></div></div></div><div class="gallery-thumb-outer"><div class="gallery-thumb-inner"><a data-thmr="thmr_232 thmr_233" class="media-gallery-thumb" href="/gallery/philippine-development-forum-on-bangsamoro-davao-city-november-5-and-6-2014"><img width="450" height="300" data-thmr="thmr_228 thmr_229 thmr_230" alt="" src="http://www.mtf.ph/sites/default/files/styles/media_gallery_thumbnail/public/media-gallery/2015the-philippine-development-forum-on-the-bangsamoro-davao-city-november-5-and-6-2014/photo-placement-1_2.jpg?itok=tgjurGwY"></a></div></div><div class="bottom"><div class="bottom-inset-1"><div class="bottom-inset-2"></div></div></div></div></div> </div>
我在模板php页面中插入类时遇到了问题，因此在css中寻找任何替代方案...... 然而，即使使用显示（内联或块）或添加填充和边距，我似乎无法做到正确...感谢任何建议
答案 0 :(得分：1)
您是否考虑过使用flex来对齐元素？
答案 1 :(得分：1)
作为快速解决方法，您可以尝试将min-height: 400px;添加到.mg-col .mg-gallery.mg-teaser课程，但您需要使用媒体查询调整400px以考虑不同的屏幕宽度。