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

Discussion in 'Web Design and Development' started by lofight, Oct 30, 2008.

  1. lofight macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #1
    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..
     
  2. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #2
    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
     
  3. lofight thread starter macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #3
    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..
     
  4. ezkimo macrumors regular

    Joined:
    Sep 12, 2002
    #4
    Look into conditional comments to supply a different css file for IE to correct the errors.
     
  5. lofight thread starter macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #5
    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..
     
  6. angelwatt Moderator emeritus

    angelwatt

    Joined:
    Aug 16, 2005
    Location:
    USA
    #6
  7. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #7
    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
     
  8. lofight thread starter macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #8
    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..
     
  9. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #9
    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
     
  10. wheelhot macrumors 68020

    Joined:
    Nov 23, 2007
    #10
    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.
     
  11. werther macrumors regular

    Joined:
    May 15, 2006
    #11
    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.
     
  12. werther macrumors regular

    Joined:
    May 15, 2006
    #12
    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/
     
  13. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #13
    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
     
  14. werther macrumors regular

    Joined:
    May 15, 2006
    #14
    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.
     
  15. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #15
    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
     
  16. lofight thread starter macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #16
    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..
     
  17. savar macrumors 68000

    savar

    Joined:
    Jun 6, 2003
    Location:
    District of Columbia
  18. werther macrumors regular

    Joined:
    May 15, 2006
    #18
    ...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.
     
  19. SrWebDeveloper macrumors 68000

    SrWebDeveloper

    Joined:
    Dec 7, 2007
    Location:
    Alexandria, VA, USA
    #19
    I was kiddin' with ya, and of course you're absolutely correct. We've all been there, done that! ;)
     
  20. werther macrumors regular

    Joined:
    May 15, 2006
    #20
    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:
     
  21. ogser macrumors newbie

    Joined:
    Mar 8, 2009
    #21
    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!
     
  22. wheelhot macrumors 68020

    Joined:
    Nov 23, 2007
    #22
    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:
     
  23. lofight thread starter macrumors 68000

    lofight

    Joined:
    Jun 16, 2007
    #23
    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.
     
  24. ogser macrumors newbie

    Joined:
    Mar 8, 2009
    #24

Share This Page