在Internet Explorer中动态设置高度转换为高度:auto

age*_*eto 2 jquery internet-explorer

此脚本获取每个span元素的高度值并将其应用于其父li元素(我编写它来解决一些浮动/布局问题).它在Firefox和Chrome中完美运行:执行后,我检查html,一切都运行正常.

但是,在IE 7和8中(没有用IE6进行尝试,搞砸了)它无法正常工作.相反,它将所有li的高度设置为auto.

这是我的代码:

$(".fase ol > li").each(function(index) {
  var li_content_height = $('span', this).css('height');
  $(this).css('height', li_content_height )
});
Run Code Online (Sandbox Code Playgroud)

和HTML:

<div class="fase">
  <ol>
    <li>
      <span>blablablablabla</span>
    </li>
    <li>
      <span>blablablablabla</span>
    </li>
  </ol>
</div>
Run Code Online (Sandbox Code Playgroud)

djd*_*d87 6

你尝试过使用高度吗?

var li_content_height = $('span').height() + $(this).height();
$(this).css('height', li_content_height);
Run Code Online (Sandbox Code Playgroud)

如果你想要高度包括填充或边距,那么你可以使用outerHeight:

var heightWithPadding = $('span').outerHeight();
var heightWithPaddingAndMargin = $('span').outerHeight(true);
Run Code Online (Sandbox Code Playgroud)