IE7 Website Display Issues /Mozilla Firefox

Discussion in 'HTML & Website Design' started by workathomeshop, Mar 6, 2008.

  1. #1
    I previously used IE7, recently changed to Mozilla Firefox due to so many issues with IE7.

    Have just realized my website lay-out viewed through IE7 is not looking so good.
    http://www.horserides.org


    Can someone please advice what I need to do?
    My stats show 70% people view through IE7 so I guess I should really do something about this, but have no idea what..
    Thanks in advanced for any advice.

    Cheers
    Samantha
     
    workathomeshop, Mar 6, 2008 IP
  2. pralu

    pralu Peon

    Messages:
    11
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    i am also having the same problem.......... can anybody tell its solution... it will be great help 4 me.

    regards
     
    pralu, Mar 6, 2008 IP
  3. sakib000

    sakib000 Active Member

    Messages:
    415
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    58
    #3
    replace this

    <div id="hd" xmlns=""><div id="hContent"><div class="editorWrap" id="headerContent">
    <div class="editableContent" id="headerZoneElement">
    <p>
    </p><center>
    <img border="0" alt="Horse Riding" src="http://horserides.org/horserides.gif"/></center>
    <p align="center"> </p></div></div></div><div id="hMisc">
    
    <div style="width: auto; height: auto;" class="contactInfoContainer"><p class="vcard">
    </p></div></div></div>
    Code (markup):

    with
    <div xmlns="" id="hd"><div id="hContent"><div id="headerContent" class="editorWrap">
    <div id="headerZoneElement" class="editableContent">
    
    <img src="All%20About%20Horses%20and%20Horse%20Riding%20-%20Horserides.Org_files/horserides.gif" alt="Horse Riding" border="0">
    <p align="center">&nbsp;</p></div></div></div><div id="hMisc">
    
    <div class="contactInfoContainer" style="width: auto; height: auto;"><p class="vcard">
    </p></div></div></div>
    Code (markup):
    find this in your css
    #hd {
    	height: 178px;
    	background: url(http://us.i1.yimg.com/us.yimg.com/lib/smb/assets/hosting/yss/themes/patina/v_1_27/images/doc_bg.gif) no-repeat;
    }
    
    Code (markup):
    replace with
    #hd {
    	height: 178px;
    	background: url(http://us.i1.yimg.com/us.yimg.com/lib/smb/assets/hosting/yss/themes/patina/v_1_27/images/doc_bg.gif) no-repeat;
    }
    
    Code (markup):
    find this
    #headerContent {
    	width: 550px;
    }
    
    Code (markup):
    replace with

    #headerContent img{
    margin:24px 0 0 15px;
    
    }
    Code (markup):
    recheck
     
    sakib000, Mar 7, 2008 IP
    workathomeshop likes this.
  4. workathomeshop

    workathomeshop Notable Member

    Messages:
    1,384
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    215
    #4
    Thanks so much for your help. I really appreicate it

    I have little knowledge with coding so have a few questions if you don't mind..
    :)




    Cheers
    Samantha
     
    workathomeshop, Mar 7, 2008 IP
  5. workathomeshop

    workathomeshop Notable Member

    Messages:
    1,384
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    215
    #5
    Having lots of issues tonight :eek:

    Can someone please tell me if the column lay-outs of the homepage:
    http://www.horserides.org
    through Mozilla Firefox are ok?

    I haven't touched a thing, and for some odd reason the lay-out, just on home page has gone funny.


    If you view the other pages, you will see the column lay-outs are fine.
    Perhaps I have a virus or something.. Driving me crazy

    Cheers
    Samantha
     
    workathomeshop, Mar 7, 2008 IP
  6. 9450184

    9450184 Peon

    Messages:
    30
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Hey,
    Yes the index page does look off in FF. You got Skype or Gtalk? If you do, pm me with contacts and I will help you to fix these issues. Just seems kind of long to go through all in forums :D

    Good luck!
     
    9450184, Mar 7, 2008 IP
    workathomeshop likes this.
  7. sakib000

    sakib000 Active Member

    Messages:
    415
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    58
    #7
    oh wait thats my fault. i m gonna give a new code
     
    sakib000, Mar 7, 2008 IP
  8. sakib000

    sakib000 Active Member

    Messages:
    415
    Likes Received:
    17
    Best Answers:
    0
    Trophy Points:
    58
    #8
    replace
    #hd {
    	padding: 38px 21px 0 30px;
    	height: 178px;
    	background: url(http://us.i1.yimg.com/us.yimg.com/lib/smb/assets/hosting/yss/themes/patina/v_1_27/images/doc_bg.gif) no-repeat;
    }
    Code (markup):
    with
    #hd {
    	height: 178px;
    	background: url(http://us.i1.yimg.com/us.yimg.com/lib/smb/assets/hosting/yss/themes/patina/v_1_27/images/doc_bg.gif) no-repeat;
    }
    Code (markup):
    this
    #headerContent {
    	width: 550px;
    }
    Code (markup):
    with this
    #headerContent img{
    margin:24px 0 0 15px;
    
    }
    Code (markup):

    this
    <div id="hd" xmlns=""><div id="hContent"><div class="editorWrap" id="headerContent">
    <div class="editableContent" id="headerZoneElement">
    <p>
    </p><center>
    <img border="0" alt="Horse Riding" src="http://horserides.org/horserides.gif"/></center>
    <p align="center"> </p></div></div></div><div id="hMisc">
    
    <div style="width: auto; height: auto;" class="contactInfoContainer"><p class="vcard">
    </p></div></div></div>
    Code (markup):



    with
    <div xmlns="" id="hd"><div id="hContent"><div id="headerContent" class="editorWrap">
    <div id="headerZoneElement" class="editableContent">
    
    <img src="http://horserides.org/horserides.gif" alt="Horse Riding" border="0">
    <p align="center">&nbsp;</p></div></div></div><div id="hMisc">
    <div class="contactInfoContainer" style="width: auto; height: auto;"><p class="vcard">
    </p></div></div></div>
    Code (markup):

    Excuse: mistake happen cause i saved the page on disk then edited ..::LOL::..
     
    sakib000, Mar 7, 2008 IP
  9. workathomeshop

    workathomeshop Notable Member

    Messages:
    1,384
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    215
    #9
    Thanks so much !
    I have managed to fix the Mozilla lay-out for the home page, don't know how I managed to stuff that up :p lol

    Will try the code for IE7 later today and see how it goes
    What would I do without DP members !

    Cheers
    Samantha
     
    workathomeshop, Mar 7, 2008 IP
  10. workathomeshop

    workathomeshop Notable Member

    Messages:
    1,384
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    215
    #10
    Thanks for trying to help with new codes, unfortunately still didn't fix the problem, made FF lay-out look odd again too so I reverted back.

    May have to live with this issue and pray people stop using IE7.


    Cheers
    Samantha

     
    workathomeshop, Mar 8, 2008 IP
  11. 9450184

    9450184 Peon

    Messages:
    30
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Hello!

    I think you should make a separate css file just for IE7, for example ie7-style.css, add it to your page like this:

    <link rel="stylesheet" type="text/css" media="screen" id="themeCSS" href="style.css">
    <link rel="stylesheet" type="text/css" media="screen" id="layoutCSS" href="custom.css">
    <!--[if IE 7]>
    <link rel="stylesheet" type="text/css" href="ie7-style.css" />
    <![endif]-->
    HTML:
    Then in this new css file, which would affect ONLY IE7, you can add changes for IE7 to make it look good :)

    You can also do the same for IE6, just change 7 to 6
     
    9450184, Mar 17, 2008 IP
  12. workathomeshop

    workathomeshop Notable Member

    Messages:
    1,384
    Likes Received:
    33
    Best Answers:
    0
    Trophy Points:
    215
    #12
    Thanks again
    Issue is fixed ! :)

    Cheers
    Samantha
     
    workathomeshop, Mar 19, 2008 IP