PDA

View Full Version : Cross Browser Checking


kt1978
04-13-2010, 01:12 AM
Hi all :confused:

I was having some problems with vertically and horizontally centering text and images in different browsers so was searching about to put something together and gain more of an understanding along the way...

The following code works in IE5.5 onwards and the latest versions of Google Chrome, Safari and Firefox. (these are the ones I have tried)

2 Questions really

1, Can anyone recommend a program like IE tester for other (older versions) browsers. I seen some other threads about this... Adobe BrowserLabs was discussed...?!?!?!

2, Searching around about this and the main problems seem to be with IE. Are the older versions of the other popular browsers as much of a problem.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Vertically and Horizontally Centered</title>
<style type="text/css">
body {
margin: 0px;
}
#outer {
display: table;
height: 300px;
width: 300px;
overflow: hidden;
background-color: #999999;
}
#inner {
display: table-cell;
vertical-align: middle;
background-color: #CCCCCC;
width: 100%;
text-align: center;
}
</style>
<!--[if lt IE 8]>
<style type="text/css">
#outer {
position:relative; /* for lte IE7 */
}
#inner {
position: absolute; /* for lte IE7 */
top: 50%; /* for lte IE7 */
}
#outer #inner p {
position: relative;
top: -50%;
}
</style>
<![endif]-->

</head>
<body>
<div id="outer">
<div id="inner">
<p style>This text is centered horizontally and vertically.<br />
This works in IE5.5 onwards. Fixes have been added for versions prior to IE8. Works with Firefox 3.6.3, Google Chrome 4.1.249.1045, Safari 4.0.5</p>
</div>
</div>
</body>
</html>



Cheers

mangofreak
04-13-2010, 02:32 AM
I only worry about browser older than IE 5.5. That's really old. What's your target group, perhaps a developing country? where connections are slow and equipment is second hand and access to new software is limited? is that it?

I just Googled: Testing Browsers and got a bunch of results.

http://browsershots.org/

Also read this:
http://www.smashingmagazine.com/2007/10/02/browser-tests-services-and-compatibility-test-suites/

DWcourse
04-13-2010, 02:33 AM
BrowserLab is good but won't go any earlier than IE6 although why you'd worry about anything before that is beyond me. Personally I've pretty much quit worrying about IE6.

mangofreak
04-13-2010, 02:38 AM
Same here.
It has to be some very special case to start worrying - again - about those older browsers.

edbr
04-13-2010, 02:46 AM
agreed i still have different versions for ie6 but it is worth forgetting about. Time to cut the strings

gentleone
04-13-2010, 06:04 AM
I agree too! I've banned IE6 for my personal projects already along time ago, but to clients I'd always ask if their new website still have to support IE6 and explain that this will cost me more time and therefor it will cost them more money :)

Corrosive
04-13-2010, 07:28 AM
My approach to IE6 is to assess potential target audience. Unfortunately a lot of corporations in the UK are stuck with IE6 due to archaic systems and old versions of java. I also assess on how badly a layout is 'broken' in IE6. If there are minor display differences then I get as close as I can and then leave it. If a layout is badly broken then I'll review and fix for IE6.

I agree that my personal stuff is aimed at an audience who can just live with it if they insist on running IE6. Can't be dealing with that :)

edbr
04-13-2010, 07:40 AM
Unfortunately a lot of corporations in the UK
then they should get on with their work and stop surfing :)

Corrosive
04-13-2010, 07:48 AM
then they should get on with their work and stop surfing :)

Aye, true. But what if the MD of that corporation is surfing in IE6 for a killer new business partnership that will net your client millions and the first thing he/she sees is a broken site?

edbr
04-13-2010, 08:37 AM
should have chosen wisely in the first place. eventually any system will need replacing , in the case of bad choices tough, it will be sooner rather than later .i know not everyone agrees but the day will have to come eventually with all the publicity about ie6 being flawed , if they do not realise they are seeing a broken sites and are not informed its because they have the evil browser, then sack the IT department

kt1978
04-13-2010, 08:52 AM
Oops... sorry, my fault for not being clear.

I didn't mean any older versions of IE. Providing I get my site working ok in IE6 onwards thats all Iím bothered about.

What I meant was...

A couple of older versions of Firefox, Chrome and Safari. Just so I can make sure that the site will be ok in those browsers. Something like IE tester.

My second point/question in my thread was asking how necessary this was. Do those browsers change so much as IE has over the last few versions?

How much is BrowserLabs?

Thanks all for your views!

Corrosive
04-13-2010, 08:55 AM
I guess that is the issue with large corps. Users will blame the website and many people just don't realise it is their browser choice that is the problem. IT departments are lone voices on this one.

IT Dept: 'We need to upgrade all our browsers.'
MD: 'OK, how much will that cost us?'
IT Dept: 'Well, conservative estimates come in at 2m.'
MD: 'Forget it, the shareholders will never have it and my bonus will not be as good. Can't people just make websites for IE6?'

Believe me, that is how the conversation goes. I have witnessed it!

Corrosive
04-13-2010, 08:55 AM
Sorry kt1978. I hijacked your thread a bit there. Sorry :(

Corrosive
04-13-2010, 08:59 AM
Oops... sorry, my fault for not being clear.

I didn't mean any older versions of IE. Providing I get my site working ok in IE6 onwards thats all Iím bothered about.

What I meant was...

A couple of older versions of Firefox, Chrome and Safari. Just so I can make sure that the site will be ok in those browsers. Something like IE tester.

My second point/question in my thread was asking how necessary this was. Do those browsers change so much as IE has over the last few versions?

How much is BrowserLabs?

Thanks all for your views!

The likes of Chrome, Firefox etc. upgrade browser versions a lot more regularly than IE. The good news is that;

1. Upgrades tend to happen automatically so most users will keep versions up-to-date.
2. These guys have been champions of web standards for years so you are on safer ground. You will always get slight differences between versions but a site shouldn't look broken as such.

It will be interesting when we launch fully into CSS3 and HTML5. I can see the old browser quirks thing happening all over again!

gentleone
04-13-2010, 09:42 AM
In the first place I design/develop for Firefox (I have to mention that I use CSS resets and develop according to the web standards). If it looks and works how it should be in this browser, than you're for 99% also good in Safari, Chrome and Opera.

Finally I check IE, but most of the IE bugs are common known and can be found on the net with explanation and all how to solve them:
http://www.positioniseverything.net/explorer.html
http://css-class.com/test/bugs/ie/ie-bugs.htm
http://css-tricks.com/ie-css-bugs-thatll-get-you-every-time/
http://net.tutsplus.com/tutorials/html-css-techniques/9-most-common-ie-bugs-and-how-to-fix-them/

michaelhunter
04-21-2010, 12:21 AM
I agree that you can't design a web site for every browerser in creation, but all of you have to realize that everyone is not internet or computer savy. To them if they can surf the web and do email they don't care (or don't know) what browser they are using unless someone tells them. To them if IE 6 works, well as the saying goes "if it aint broke don't fix it"

I know the site I am working on is going to be viewed by a lot of people who are still running IE 6. Unfortunatly if it does not work properly in 6 (which by the way it does not) but it works fine in IE 8, Firefox, Safari (which it does) I just will have to fix it. I don't get to pick my customers.

And for all you who think most Americans are Internet savy, well why does a vast amount of Americans don't have high speed internet (like my sister-in-law) because of cost or living in a community that does not have it.

Just do what you have to do ladies and gentlemen.

DWcourse
04-21-2010, 12:56 AM
@michaelhunter if, as you say, most people aren't that concerned about the quality of their web experience (especially those still using IE6). I'd say that makes the argument for not sweating the details for IE6. If the page is usable but with a few design issues in IE6 I'd say that's good enough. If the page is totally unusable in IE6, then maybe it's worth fixing (or maybe not). It depends upon how much of your market (not your viewers) are using it.