artsexylightbox problem when using IE8

Question

I'm using the art sexy lightbox for my pictures presentation and also for html content in joomla. I'm using the Chrome and it works fine and displays everything as it should. The problem starts when i switch to ie8. When i click on the image to xpand in the lightbox the image displays in the center of the page while the thole frame of the picture is on the left of the image.

I've tried playing with the artsexylightbox css file but couldnt get it to work in both browsers.

does anyone can say why is the difference? I suspect that the browsers treat the absolute,relative orders differently.

please help:(

Answer 1

You could tr to target WEbkit broswers only in your CSS to separate the behaviours of IE and Chrome (Safari ius a webkit browser too).

@media screen and (-webkit-min-device-pixel-ratio:0) {
    /* Webkit-specific CSS here (Chrome and Safari)*/ 

#artsexylightbox  {
   properties here
  }
}

Or you could use Conditional Comments to set up a new CSS stlyesheet for IE:

    <!--[if lt IE 9]>

  <link href="path-to-file/IE.css" rel="Stylesheet" type="text/css"/>

    <![endif]-->

Then use setup the properties that work for IE in the IE CSS, and the properties that work for Chrome/Safari in the normal CSS.

Note that even between FF and Chrome, there are a few differences in how they interpret CSS.

Hope that helps :)