Cross-browser compatibility - Site rendering differently in same exact browser

Dev Shed Forums Sponsor:

September 27th, 2012, 04:34 PM

Jorge S

Registered User

Join Date: Sep 2012

Posts: 2

Time spent in forums: 13 m 27 sec
Reputation Power: 0

New Member - Cross-browser compatibility - Site rendering differently in same exact browser

Is there any reason why my site would render properly in IE8, 9, and Chrome (all same versions) on my machine, and then render differently on another machine?
I have attached screenshots of a site I'm developing. These shots are from my client. In all three cases, this site renders just fine on my end using the same exact browsers.
My client also tells me that font colors are not showing up properly in the latest version of Safari, when they show up just fine on my machine.
Any direction would be very helpful. Very urgent.

New user, so I'm not allowed to post URLs, but I can provide screenshots if need be.

September 27th, 2012, 05:36 PM

Kravvitz

CSS & JS/DOM Adept

Dev Shed God 30th Plane (19500 - 19999 posts)

Join Date: Jul 2004

Location: USA

Posts: 19,835

Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192

Welcome to DevShed Forums, Jorge S.

As you found out new users are restricted from posting URLs until they have made 5 posts. You may need to get around this by leaving out the "http://" and putting a space before each ".". Yes this rule is annoying, but the administrators say it's necessary for limiting spam.

P.S. Why did you categorize your question as a homework question?

__________________
Spreading knowledge, one newbie at a time. I'm available for hire at Dynamic Site Solutions.

Check out my blog. | Learn CSS. | PHP includes | X/HTML Validator | CSS validator | Common CSS Mistakes | Common JS Mistakes

Remember people spend most of their time on other people's sites (so don't violate web design conventions).

September 27th, 2012, 05:53 PM

Jorge S

Registered User

Join Date: Sep 2012

Posts: 2

Time spent in forums: 13 m 27 sec
Reputation Power: 0

Thanks for the welcome.

I posted as a homework question accidentally. My apologies.

The "links" to the screenshots are as follows:

The actual site: gaintalent.com/temp

Chrome: screenshots.cc/show/304/ptzdc

IE8: screenshots.cc/original/303/w2xh2

IE9: screenshots.cc/original/302/gnfax

What it should look like: screenshots.cc/original/301/ker3m

September 27th, 2012, 11:26 PM

Kravvitz

CSS & JS/DOM Adept

Join Date: Jul 2004

Location: USA

Posts: 19,835

Time spent in forums: 6 Months 1 Day 22 h 11 m
Reputation Power: 4192

Are you aware that your page contains errors? The first step in debugging should always be making sure that your code is valid (in order to rule out any errors as the cause for the problem).
http://validator.w3.org/

The page looks fine in IE9 here.

The wrong footer color is caused by the following, which gives it a background color that's equivalent to "rgba(255,255,255,.27)" using IE's filter property.

Code:

				<!--[if lt IE 9]>
				<style type="text/css">
				   #footer { 
					  background:transparent;
					  filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#45ffffff,endColorstr=#45ffffff);				
					  zoom: 1;
				    } 
				</style>
				<![endif]-->

I've got Safari 5.1.2 (for Windows) here and the font colors look fine to me.

New Member - Cross-browser compatibility - Site rendering differently in same exact browser

Developer Shed Advertisers and Affiliates