html - 试图对齐 div

Question

有些文本内容较小，有些较大如何使它们看起来相同并应用相同的边距

此外，当我减小浏览器尺寸时说移动尺寸我看到第二个和第三个 div 之间的差距这是 codepen 的链接 http://codepen.io/rahulv/pen/PGLBdY

CSS:

.  div.outer_certi{
margin-top:2%;
height: 100%;
  }
  .certification p{
 padding:1% 1% 1% 1%;
 }
 .certification img{
padding:1% 1% 1% 1%;
float: left;
max-width:200px;
height:auto;
 }
 .certification{
 border:1px solid #e6e6e6;
 background-color:#faf9f;
overflow:hidden;
}
.certification:hover{
-moz-box-shadow: 0 0 10px #ccc;
      -webkit-box-shadow: 0 0 10px #ccc;
      box-shadow: 0 0 10px black;
}

Answer 1

在您的 .certification 类中添加 overflow:hidden;

差距来自您的 div.outer_certi 选择器。从该规则中删除 margin 。

如果你只想为第一个元素添加边距，那么这样做

div.outer_certi:first-of-type {
margin-top:2%;
}

如果你想让所有的div高度相同，你可以试试:

.certification{
 min-height:150px;/* set this to you choice*/
}