css - Why is display:inline killing IE 8.0 performance? -


I have an image gallery based on this jQuery plugin:

It works really well in Firefox, Chrome and even IE 7.0, but when I try with more than 50 images in IE 8.0, this work is incredibly slow. Just hovering over the thumbnail brings up the CPU load up to 100%.

At first I thought this is a Javascript problem, so I used the IE profiler, but the results were normal. After this I checked the CSS and finally found the reason:

.sliderGallery ul light {display: inline; }

It becomes thumbnail to align horizontally. If I get a chance to display: Block, the display is ok and the scroller is still working, but obviously it looks strange, because the thumbs are vertical.

My question:

  1. Why is IE 8 having this problem with many displays: inline element
  2. What can I do to solve it I'll gladly provide more information if needed.

You can try having: 

  display: inline- Block;   
 instead of  display: inline;  
 
 Lammi knows that this works.

Comments

Post a Comment