1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Firefox vs IE Differences?

Discussion in 'HTML & Website Design' started by mjblake, Feb 13, 2010.

  1. #1
    Hi,

    I wonder if anyone out there can help me understand why (I'm told) the left side of my site shows up wierd in Firefox. I'm an IE user and everything looks fine to me.
    I use Dreamweaver and don't know as much about that as I'd like to either.

    Any and all help is appreciated!
     
    mjblake, Feb 13, 2010 IP
  2. sizzlefire

    sizzlefire Member

    Messages:
    397
    Likes Received:
    10
    Best Answers:
    0
    Trophy Points:
    35
    #2
    Your site runs off the side of the page badly in Firefox. Here, use this: http://browsershots.org/ it will help you see what its doing.
     
    sizzlefire, Feb 13, 2010 IP
  3. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    well, that confirms it... so what now? anyone know how to fix it?

    On a side note, I've also had firefox users tell me it looks fine. different versions of firefox, you think?
     
    mjblake, Feb 13, 2010 IP
  4. Dee2007

    Dee2007 Active Member

    Messages:
    1,185
    Likes Received:
    27
    Best Answers:
    0
    Trophy Points:
    88
    #4
    Hi, is it the site in your sig?

    If so it doesn't over run for me, I am using the latest version of FF
     
    Dee2007, Feb 13, 2010 IP
  5. Dee2007

    Dee2007 Active Member

    Messages:
    1,185
    Likes Received:
    27
    Best Answers:
    0
    Trophy Points:
    88
    #5
    Hi, is it the site in your sig?

    If so it doesn't over run for me, I am using the latest version of FF
     
    Dee2007, Feb 13, 2010 IP
  6. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Yes, it is http://www.NewToManagement.com I'm not sure what you mean by over run. Do you mean that it looks ok? If so, any thoughts on the problems others are having?
     
    mjblake, Feb 13, 2010 IP
  7. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #7
    mjblake, Feb 13, 2010 IP
  8. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #8
    I don't see the issue either.
    Never, ever use IE as a reference for how things should work. IE is 12 years behind all other browsers in modern standards and practices. Always, always use a modern browser (anything but IE) to create pages with. As you go along testing your page, occasionally glance at IE to see if/when it screws things up. But there are hundreds of web sites dedicated to fixing IE and its quirks and bugs are well known as are the hacks to fix it.
    Any time you use an automatic code generator like DW you can't be sure how the resulting HTML or CSS will turn out. Invalid markup makes any page unpredictable.
     
    drhowarddrfine, Feb 13, 2010 IP
  9. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,998
    Best Answers:
    253
    Trophy Points:
    515
    #9
    Oh wow that's bad. Just exactly which wysiwyg editor ****ed you up the *** this badly? Oh look, Dreamweaver, I'm SO shocked... No wait, not shocked... That other thing... What's the opposite of shocked again?

    Where to start... endless pointless tags (strong inside H2's?!?), CSS inlined in the markup, tables for layout, paragraph, strong and em around heading elements, clearing breaks, comment placement that could trigger IE rendering bugs, and the root of your problem, the use of fixed sized elements like that site name, etc, etc...

    Even so, 99% of your problem is here:
    
    <div id="header">
        <table width="100%" border="0" align="center">
          <tr>
            <th width="90%" align="left" scope="col"><img src="images/Header2.jpg" width="1100" height="100" alt="NewToManagement.com | Advice for Managers" /></th>
          </tr>
        </table>
    
    Code (markup):
    You aren't doing anything that warrants the use of the DIV OR the TABLE, and that's a giant fixed width image on a fluid website... which looks stupid when the page is wider than 1100px and breaks the layout when it's narrower.

    That should PROBABLY be your H1, with a gilder-levin type image replacement on it. (since I dont' see any elements on the page suitable for use as the h1)... That most certainly should NOT be a IMG tag since that's a presentational affectation of the text "NewToManagement.com"

    Really I'd have to chuck ALL of the markup as a first step before even TRYING to fix that mess. Tables for nothing, paragraphs around non-paragraph elements...

    It's an excellent example of the quote in my signature.
     
    deathshadow, Feb 13, 2010 IP
  10. mywebwork

    mywebwork Guest

    Messages:
    26
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #10
    mywebwork, Feb 14, 2010 IP
  11. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Well thanks for all the feedback, guys. The only problem is I don't know how to fix all of the problems you pointed out. I was told Dreamweaver was a good website builder. Its what I've been learning on. Actually I used Frontpage 2000 before that and had even more trouble!

    Sounds like fixing the header in some fashion will mostly fix this problem. I'll research the gilder/levin image replacement (hadn't heard of that one yet). I'll also work with the W3 Validator.

    Also I'll download Firefox and Chrome to keep up with how things look to others.

    On a side note, I've managed to screw up my template in Dreamweaver and now can't change the meta data on each page (after it took me a month to figure out how to do it in the first place!!). I can't make the meta data on each page editable.Anyone here know anything about that?
     
    mjblake, Feb 14, 2010 IP
  12. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #12
    Just to emphasize: you don't test in IE and look at FF/Chrome as "the others". You look in FF/Chrome first as your reference for how things work. IE is the odd "other".
     
    drhowarddrfine, Feb 14, 2010 IP
  13. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #13
    Understood. Thank you.
     
    mjblake, Feb 15, 2010 IP
  14. Provenzano

    Provenzano Active Member

    Messages:
    190
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    51
    #14
    I have the same problem with my site (futbolname.com)
    With IE the left sidebar looks at the footer but it's OK with Firefox. I think FF has more users than IE has, also in my visitor statistics FF is the browser with the first spot but it'd not be bad if I Fix it : )
     
    Provenzano, Feb 15, 2010 IP
  15. deathshadow

    deathshadow Acclaimed Member

    Messages:
    9,732
    Likes Received:
    1,998
    Best Answers:
    253
    Trophy Points:
    515
    #15
    Bwahaaha, uhm, no.

    Your statistics are probably screwed BECAUSE your site doesn't work right in IE... Either that or your stats lists the different versions of IE separate from each-other...

    As to your problems, with 79 validation errors you do not even have HTML, you have gibberish... compounding that is you managed 79 validation errors in a tranny doctype, which would almost seem intentional.

    While much of your problems stems from the "all Wordpress templates are COMPLETE rubbish" issue, there's a LOT of stuff you could fix before you even got to the CSS. There's easily two to three times as many DIV as necessary, double breaks doing margin and padding's job, hordes of presentational rubbish inlined in the markup (like all those social bookmarks), clearing breaks, and I'm not even sure how that's pulling off having columns...
     
    deathshadow, Feb 15, 2010 IP
  16. rive0108

    rive0108 Peon

    Messages:
    119
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #16
    I have noticed the FF/IE problem in alot of sites. My site was "tested" using FF, and it all looked fine. In IE of course there where tons of errors. (mostly in the <div></div> tag elements missing the font-size/style color/colspan/td width %-the css was changing the text color and size, but it wasnt in the <div>, so google and the other engines were showing a cached image that was broken, and where the text was black, oversized, and the same color as the background. Alignment was all to the left on images and adverts, because there was no center align in the divs (now depreciated).

    Contrary to what some here say about IE, it rendered, the alignment issues that were evident in the machine design reads, as well as the Google and other engine caches of the site.

    I verified this with both a web editor design mode, using a machine read, and Google cache which showed the same errors. It took me along time to fix the divs.

    FF will "fix" errors in the div and css, while IE will not. It will render the site as coded. In this, I prefer IE when "testing" website design and build. 71% of worldwide traffic to my site use the IE browsers, while only 17% use FF. So it is critical that the site render properly in machine reads, and IE browsers.

    Here is how it looks in IE:

    [​IMG]
     
    Last edited: Feb 15, 2010
    rive0108, Feb 15, 2010 IP
  17. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #17
    If there were HTML or CSS errors in IE, then the same errors were in any other browser. Which browser you view with makes no difference.
    You can make any page work well in one browser but screwed up in the others if you try.
    Browsers don't "fix" errors in your markup (and you have 177 of them). Browsers will attempt to handle your errors the best it can if that's what you mean. It's far better to write valid markup first than count on browsers to guess your intentions.

    In addition, you're using the XHTML 1.1 doctype, which is an XML application that is to be served as XML but you are serving it as HTML. You should be using HTML 4.01. Fixing all those errors will go a long way toward your learning how to code as IE gets eliminated over the next few years.
     
    drhowarddrfine, Feb 15, 2010 IP
  18. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #18
    I've found 2/3 of my traffic to be from IE and the other third being from FF and Chrome. Obviously I'd like it to work correctly from all browsers. In Chrome, everything looks ok, as it does in IE. Only FF looks wrong so far... of course, it also depends on screen resolution.

    I've got a lot of work to do.
     
    mjblake, Feb 15, 2010 IP
  19. drhowarddrfine

    drhowarddrfine Peon

    Messages:
    5,428
    Likes Received:
    95
    Best Answers:
    7
    Trophy Points:
    0
    #19
    @mjblake,
    Fix your html and css errors and you won't have so many problems.
     
    drhowarddrfine, Feb 15, 2010 IP
  20. mjblake

    mjblake Peon

    Messages:
    33
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #20
    Right. That's obviously the work that i need to do. Learning more about the errors that are generated while using software. I tried coding from scratch in notepad, but nothing ever looked very professional so I tried using web-building software. In IE, it looks pretty good... of course, clearly not everyone uses IE. Most people - but not everyone.
     
    mjblake, Feb 15, 2010 IP