警报有多条线时引导中心警报关闭按钮

另一种方法是将关闭框设置为 absolute 但一个不幸的副作用是,你必须硬编码顶部 margin .

.alert-info {
  position: relative;
}

.close {
  float: none;
  position: absolute;
  right: 10px;
  top: 50%;
  margin-top: -10px; /* Needs to be half the height of the element (21/2) */
}

我 recreated this in a js.fiddle if you want to see it in action 希望能有所帮助。

编辑 看起来 height 需要基于关闭框(X)而不是 top-padding 。元件高度为 21px 所以 -10px 效果很好。 Updated the Fiddle to showcase this update .

对齐的步骤 close 按钮垂直居中添加下面的css将使其成为 vertically aligned centered .

注释

仅给予 line-height:0 将使其居中,但会影响这些 alerts 有单行文本的。 谢谢

.alert{
   position:relative;
}
.close{
  position:absolute;
  top:48%;
  right:35px;
  line-height:0;
}

就是这样