CSS-Tricks / MovingBoxes

Simple horizontal slider which grows up the current box when it's in focus (image, title & text) and back down when it's not in focus.
http://css-tricks.github.io/MovingBoxes/
GNU Lesser General Public License v3.0
280 stars 147 forks source link

IE and Firefox doesn't minimize the pictures #77

Closed neonxz closed 12 years ago

neonxz commented 12 years ago

So I've done some easy modifying on the wrapper and arrows and everything looks good in Chrome. Now when I checked them in IE9 and Firefox I only see one picture in it's full size covering the whole MB-area. All the functionallity is there thought.

I don't know/can't find the CSS causing this. But it's only there I've changed things.

Pictures, Chrome: http://dl.dropbox.com/u/782480/MB-chrome.PNG

IE9 and Firefox (looks the same in both): http://dl.dropbox.com/u/782480/MB-FF_IE.PNG

Probleably something easy.. oh my css is the following if it helps: http://pastebin.com/uyK8dkVS

Thx :)

Mottie commented 12 years ago

The first two lines of css use an ID of #movingboxes. Try changing that to #slider to hopefully match the id of the ul as I have in this demo:

/* Default MovingBoxes wrapper size */
#slider {
    width: 900px;
    min-height: 200px;
}

/* Default MovingBoxes panel size */
#slider > li {
    width: 100px;
}

I'm only guessing since I didn't see any HTML.

neonxz commented 12 years ago

I used div in my HTML with the matching id. But when I tried changing to ul everything looked good in all the browsers! Thank you!