please help me resolve these issues. the banner looks pushed down in chrome. and now the first slide in the banner in firefox and opera is pushed up, and reversely pushed down in ie9. please help!!! thank you in advance.

 

moreaboutme.org

Try using a Master Reset. It may require a little work to re-position your elements but it solves most cross-browser incompatibilities.

List-style-types:none on the slider should fix it

 

looks like you've found that

Edited January 7, 201313 yr by mteam

I'm looking at this on a Mac, in Firefox, Chrome and Safari. First of all, the blue image seems to be shorter than the rest. It produced a "truncated" error when I tried to open in Photoshop, so maybe try saving that image again. I would also declare a height and width on the images themselves, as well as in the CSS for the containing div.

 

If you're just using simple fade animations without any paging, I suggest using the jQuery Cycle function. It's clean, easy to use, and there is no CSS that could possibly mess up your layout. You just style the containing div how and where you want it, and let the jQuery do the rest. http://jquery.malsup.com/cycle/

 

Alluziion has a good idea too, just to make sure there is no extra padding or margins on something being added by other browsers.

failing that validate your website.

 

http://validator.w3.org/

 

fix your issues and you will no doubt have zero cross browser compatibility issues.

 

Hope that helps

I'm looking at this on a Mac, in Firefox, Chrome and Safari. First of all, the blue image seems to be shorter than the rest. It produced a "truncated" error when I tried to open in Photoshop, so maybe try saving that image again. I would also declare a height and width on the images themselves, as well as in the CSS for the containing div.

 

If you're just using simple fade animations without any paging, I suggest using the jQuery Cycle function. It's clean, easy to use, and there is no CSS that could possibly mess up your layout. You just style the containing div how and where you want it, and let the jQuery do the rest. http://jquery.malsup.com/cycle/

 

Alluziion has a good idea too, just to make sure there is no extra padding or margins on something being added by other browsers.

 

That worked, declaring the sizes. also validated the page. Thank you very much.