Modify Magento Carousel - itemslider

Question

On my Homepage, I have a Carousel with products and Featured Products that are displaying the slider with arrows on each side. But of course, I see all breaks in IE8. Every image of a product on the carousel is displaying on a single row like there's a "display: block;" property applied. So I found styles.css in two folders, of my Interface folder but when I modify the Carousel Styles -> nothing is happening at all. I saw there are dynamically created CSS files but I'm not really familiar with that technique. So I just want to apply a different CSS file for that item slider to clean the IE8 mess. I registered my CSS file with a condition in the local.XML file. But again -> nothing happens.

Here's the store: http://dev.elmaira.bg/

Answer 1

As you said, it looks like you have Magento merging your CSS into one dynamically generated file. You can turn this off in Admin > System > Configuration > Developer > CSS Settings > Merge CSS Files. You can test by turning that setting off.

However, this is a generally good, though imperfect, feature to have turned on in production. When you confirm that your CSS changes work with the merge off, you can turn the merge back on and clear the current generated files in Admin > System > Cache Management > Flush JavaScript/CSS Cache. You may also need to flush your browser's cache as well as Magento tends to regenerate the same hash for the file name unless additional files are added.