Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

IE shows website different (and wrong) compared to any other browser..

lofight

lofight

macrumors 68000
Original poster
Jun 16, 2007
1,954
2
I making a site, and because iweb was to limited I decided to hand-code it..

I know very little about html and css, so that's maybe the problem...

The site involves a slimbox (lightbox clone) gallery with 16 photos that is misplaced with Internet Explorer and comes out really well in all other browsers, except a little bit wrong in Opera, but it is exceptable..

This is the link of where the gallery is: www.chateaudepeyrolles.com/exterior.html

Try the site with safari, firefox or chrome and you'll see how the gallery has to look like, and then try it on Windows with Internet Explorer...

Thanks for all help..
 
I believe ya.

Since you admit to being a novice at HTML, in layman's terms MSIE was written with loose interpretation of very strict standards for how web sites are coded. Since the browser at one point accounted for 98% of the market place many developers coded to make sites look good only in MSIE. Microsoft never forced compliance and only worked on browser integration into the OS and features, spending little time making fixes to the core engine.

Most other browsers these days are far more compliant to these strict standards since those are open source developed by people who know what they're doing for the core elements of the browser.

Adhering to standards is what makes those browsers render pretty much the same. MSIE's next major version 8 is reported to be more standards compliant, but we'll see. Microsoft knows this means sites designed with loose standards (i.e. those that look good in MSIE 6 and 7 only) will effectively "break" so they actually added into the beta for 8 some config options to render as MSIE 6 (disable strict syntax). They also suggest developers use a special tag in their code that tells an MSIE 8 browser to render in MSIE 6 mode so the user doesn't need to switch their browser.

More stupidity from Microsoft if you ask me, but I hope all this answers your question completely as to why MSIE renders badly, uniquely. MSIE 8 might do better in standard mode, long story short.

-jim
 
SrWebDeveloper said:
I believe ya.

Since you admit to being a novice at HTML, in layman's terms MSIE was written with loose interpretation of very strict standards for how web sites are coded. Since the browser at one point accounted for 98% of the market place many developers coded to make sites look good only in MSIE. Microsoft never forced compliance and only worked on browser integration into the OS and features, spending little time making fixes to the core engine.

Most other browsers these days are far more compliant to these strict standards since those are open source developed by people who know what they're doing for the core elements of the browser.

Adhering to standards is what makes those browsers render pretty much the same. MSIE's next major version 8 is reported to be more standards compliant, but we'll see. Microsoft knows this means sites designed with loose standards (i.e. those that look good in MSIE 6 and 7 only) will effectively "break" so they actually added into the beta for 8 some config options to render as MSIE 6 (disable strict syntax). They also suggest developers use a special tag in their code that tells an MSIE 8 browser to render in MSIE 6 mode so the user doesn't need to switch their browser.

More stupidity from Microsoft if you ask me, but I hope all this answers your question completely as to why MSIE renders badly, uniquely. MSIE 8 might do better in standard mode, long story short.

-jim
Click to expand...

thanks for the information. But the problem is, the site has to go online in december and I don't think the next version will be out then? And if so, the most people who are going to visit the site, aren't really technical minds, just normal people, so there's a chance they don't have version 8 yet..
 
Look into conditional comments to supply a different css file for IE to correct the errors.
 
ezkimo said:
Look into conditional comments to supply a different css file for IE to correct the errors.
Click to expand...

Could you tell me how my html can sign a Internet Explorer user? Even then, I'm not sure it would work.. For getting the gallery right with safari, I looked with every adjustment at a preview and adjusted it so it looked right..
 
RE: correcting CSS to resolve this issue

That might not be enough. Let me explain:

In this situation the OP is using slimbox, a clone of Lightbox that uses the mootools framework. According to the slimbox web site requirements:

  • The Slimbox CSS are simpler and 100% valid (no more CSS hacks). Also, all images used by Slimbox are specified in the CSS instead of the Javascript so it is easier to style.
  • Slimbox does not use the 1 pixel transparent gif image needed by Lightbox.
And of course, it has been tested in all modern browsers: Firefox, Internet Explorer 6+, Opera 8+, Safari 1.3+ and Camino. It is not compatible with the old Internet Explorer 5.5 and will never be.
Click to expand...

As you can see, the author claims the CSS is cross browser compatible with all latest versions except MSIE 5.5 (which is the burden of the user to resolve by upgrading to 6 which has been out for years). So it is probable that conditional CSS might resolve this issue, but it might also be related to the JavaScript custom classes. Mootools is DOM based (meaning written to comply with strict standards which most browsers support and render nearly identically), but slimbox extends functions so we're looking at a third party add-on to the original framework. A framework that probably isn't as good as Lightbox, even though a smaller footprint in code size. This might be a contributing factor.

Please take the advice to check the CSS anyway because, if it does resolve your issue, it's the easiest possible fix. If that yields no positive results, considering switching to Lightbox2 and if you use any of the third party plugins for your gallery, test them on MSIE before installing on your site. This is my advice, I know you're not an HTML/CSS guru and all this complicates things. I apologize for that, but this is a thorough and well researched response based on my experiences with open source frameworks which, in my opinion, are rarely equal in quality.

FYI

-jim
 
SrWebDeveloper said:
RE: correcting CSS to resolve this issue

That might not be enough. Let me explain:

In this situation the OP is using slimbox, a clone of Lightbox that uses the mootools framework. According to the slimbox web site requirements:



As you can see, the author claims the CSS is cross browser compatible with all latest versions except MSIE 5.5 (which is the burden of the user to resolve by upgrading to 6 which has been out for years). So it is probable that conditional CSS might resolve this issue, but it might also be related to the JavaScript custom classes. Mootools is DOM based (meaning written to comply with strict standards which most browsers support and render nearly identically), but slimbox extends functions so we're looking at a third party add-on to the original framework. A framework that probably isn't as good as Lightbox, even though a smaller footprint in code size. This might be a contributing factor.

Please take the advice to check the CSS anyway because, if it does resolve your issue, it's the easiest possible fix. If that yields no positive results, considering switching to Lightbox2 and if you use any of the third party plugins for your gallery, test them on MSIE before installing on your site. This is my advice, I know you're not an HTML/CSS guru and all this complicates things. I apologize for that, but this is a thorough and well researched response based on my experiences with open source frameworks which, in my opinion, are rarely equal in quality.

FYI

-jim
Click to expand...

I tested it with IE 6 and 7 and there it looked bad.. I will recode my site with lightbox when I have time, and check if it does any good, otherwise I'll have to do it with conditional comments..
 
Noted, expected.

Like I said, take the advice of others and do the CSS and see if it resolves your issue. If not, then switch to a different framework. I'm just letting you know it's a possibility slimbox's Javascript code might be contributing.

-jim
 
Welcome to the world of web designing which is full of so called standard that is not really implemented across the web browsers.

IE6 sucks bad, how bad? REALLY BAD, it makes me want to puke when I need to develop stuffs on IE, esp. IE6. I honestly hope IE8 would be much better, IE7 is okay, excepts its a freaking slow browser, it can't even open multiple tabs quickly, 1 tab requires like 1-2 second so that the another one can be opened.

For web designing, go for Firefox first, then Safari (or any WebKit browser engine; Chrome, and etc.), Opera and finally IE, cause IE WILL have a lot of bugs to be fixed and fixing those bugs on IE doesn't mean it will work on the other browsers out there.

I usually (and I guess most of us?), has a separate CSS layout for IE users.

That's why I'm considering Flash for some websites, especially those website that you can expect to see IE6 users. Although you will be sacrificing accessibility and some other problems.
 
I have used slimbox on a number of sites and never had a problem with cross-browser compatibility. I test ie6, ie7, ff2,ff3, safari, camino, etc with no problems. Of course, I always have the usual issues with ie6.
 
Um, the OP noted only in MSIE 6 and 7 it doesn't render properly. You said the same thing, describing your trouble as "the usual problems". We're trying to solve that specific problem which you just actually confirmed for the OP that they're not alone! As stated, it's either the CSS or the Javascript, and I discussed in depth the reasons to consider switching framework after trying the CSS fixes first.

Good job, though, suggesting a validation check - it might not fix the issue, but sure as heck helps in the long run!

-jim
 
I am sorry for the confusion. By 'the usual problems' I meant regarding other elements. Double-margin error, peekaboo bug, etc. I checked his code to see if some of the problems one typically has with ie6 regardless of using lightbox/slimbox applied. The first things I noticed were improperly closed tags.
 
Yep, I follow ya. Like I said before, great advice, if it turns out a few missing or improperly closed tags are to blame, we'll all bow to your feet and toss flowers at your torso and sing praise of your holy name.

Promise!

-jim
 
werther said:
I checked the source code to your site and I see a some DIV's not closed right and as well an H2 element not closed. Validate your code before you do anything. http://validator.w3.org/
Click to expand...

I'll try that first.. But the problem is maybe that I unconscious made hacks, because when I use Skedit's full clean, and preview my site, it turns out completly wrong..
 
SrWebDeveloper said:
Yep, I follow ya. Like I said before, great advice, if it turns out a few missing or improperly closed tags are to blame, we'll all bow to your feet and toss flowers at your torso and sing praise of your holy name.

Promise!

-jim
Click to expand...

...I don't think that's asking too much.


I don't have ie6 on hand (nor ie7) at the moment to check what exactly the issue is. But I have had it happen before with ie where I forgot to properly close an anchor tag in the navigation for a site which consisted of an a**-ton of code. -It threw the entire site out of whack in only ie and took me hours of gratuitous hacking before I simply tried validating.

I would like you to believe that I never had fallen fool to this folly a second time....but that would not be true.
 
As one Virginian to another, I knew you were kidding. I don't post that often but I am hangin' round all the time. In just about every bloody thread started here, you have valuable input.

I just suck at using smileys. :eek:
 
Hello lofight, as I see, you solved your problem. Could you please tell me, how you done it? I have the same problem... My e-mails is icarssu@yandex.ru. Thank you!
 
Welcome to the world of web development where countless hours of bugs fixing will bald you up.

I swear that if the law allows me to sue Crappysoft for releasing the worst browser in the world, I will sue them big time! For making people getting unnecessary headaches and raising blood pressures! :mad:
 
ogser said:
Hello lofight, as I see, you solved your problem. Could you please tell me, how you done it? I have the same problem... My e-mails is icarssu@yandex.ru. Thank you!
Click to expand...

I still haven't. I don't know exact, but you could try replacing your div's in html and/or css. But I don't exactly know what the cure is. I'm now on contact with a professional web designer who's going to edit my code.
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back