将div减小到它包含的图像的大小

Question

我需要在垂直和水平方向上将图像置于另一个图像的顶部。 以下代码在Chrome中运行正常，但在IE中失败，因为容器DIV会拉伸以填充剩余的水平空间。

在IE8中显示：

＆＃13;

＆＃13;

def split_it(n, arr)
  return [arr] if n==1
  m = (arr.size.to_f/n).ceil
  [arr.first(m)] + split_it(n-1, arr[m..-1])
end

split_it(1, arr)  #=> [[1, 2, 3, 4, 5, 6, 7, 8, 9]] 
split_it(2, arr)  #=> [[1, 2, 3, 4, 5], [6, 7, 8, 9]] 
split_it(3, arr)  #=> [[1, 2, 3], [4, 5, 6], [7, 8, 9]] 
split_it(4, arr)  #=> [[1, 2, 3], [4, 5], [6, 7], [8, 9]]  
split_it(5, arr)  #=> [[1, 2], [3, 4], [5, 6], [7, 8], [9]] 
split_it(6, arr)  #=> [[1, 2], [3, 4], [5, 6], [7], [8], [9]] 
split_it(7, arr)  #=> [[1, 2], [3, 4], [5], [6], [7], [8], [9]] 
split_it(8, arr)  #=> [[1, 2], [3], [4], [5], [6], [7], [8], [9]] 
split_it(9, arr)  #=> [[1], [2], [3], [4], [5], [6], [7], [8], [9]] 

＆＃13;

body {
  background-color:#180e0b;
  font-family:DejaVu Sans Mono ;
  font-size: 13px;
  color: white;
}

.text {
  float:left;
  padding-right: 6px;
}

.container {
  position: relative;
  display: inline-block;
  vertical-align: top;
  background-color: brown;
}

.thumb {
  display: block;
}

.loading {
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -8px;
  margin-top: -8px;
}

＆＃13;

＆＃13;

＆＃13;

我正在使用 IE 解决方案， IE 兼容，没有硬编码的固定值。