0

我正在尝试使用 vertical-align: middle; 使图像垂直居中。但我似乎根本无法让垂直对齐产生任何效果。我已经设置了行高和高度，但没有任何效果。

萨斯：

.lot-images {
  position: relative;
  float: left;
  min-height: 300px;
  *height: expression(this.scrollHeight < 300 ? "300px" : "auto");
  padding-right: 65px;
 .viewer-wrapper {
    height: 415px;
    width: 450px;
    line-height: 415px;
    position: relative;

    .main {
    position: relative;
    display: block;
    text-align: center;
    height: 415px;
    line-height: 415px;
    width: 100%;
    max-width: 450px;
    max-height: 415px;
    font-size: 0;
    cursor: pointer;
    &.small {
      img {
        display: inline-block;
        max-height: 100%;
        max-width: 100%;
        height: auto;
        width: auto;
        vertical-align: middle;
      }
    }
  }
}

哈姆勒：

.lot-images
  %div.viewer-wrapper
    .facebook
    %a.pinterest{ :href => '#', :target => '_pinterest' }
    .main.small
      %img
    %div.gallery-pager.prev.hide
      %i
    %div.gallery-pager.next.hide
      %i
.thumbnails

整个容器位于模态框内。

如果您需要更多信息，请告诉我。谢谢！

4

1 回答 1

0

不是sass，是scss。你的代码有效。看我的例子：jsfiddle

你能解释更多是什么问题吗？并显示你的 html

于 2012-06-11T19:07:13.933 回答