www.webdeveloper.com
Results 1 to 11 of 11

Thread: Firefox Design To IE, need help for a quick fix.

  1. #1
    Join Date
    Dec 2005
    Posts
    27

    Unhappy Firefox Design To IE, need help for a quick fix.

    Well I designed my site in Firefox and just asumed it would look the same in IE but alas it does not here is the section that is wrong:

    http://img54.imageshack.us/img54/9493/untitled29ey.jpg

    The code for this section is as follows:

    Code:
    <div align="center" STYLE="position:absolute; top:136px; left:0px;"> <img src="images/nav_top.gif" width="160" height="202"></div>
    <div align="center" STYLE="position:absolute; top:288px; left:0px; bottom:0px;"> <img src="images/nav_bottom.gif" width="160" style="height:100%;"></div>
    <div align="center" STYLE="position:absolute; top:0px; left:0px;"> <a href="index.htm"><img src="images/title.gif" width="326" height="136" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:236px; left:16px;"> <a href="index.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','images/home_on.gif',1)"><img src="images/home_off.gif" name="home" width="113" height="45" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:275px; left:16px;"> <a href="news.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('News','','images/news_on.gif',1)"><img src="images/news_off.gif" alt="News" name="News" width="128" height="39" border="0"></a> </div>
    <div align="center" STYLE="position:absolute; top:314px; left:16px;"> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('database','','images/database_on.gif',1)"><img src="images/database_off.gif" name="database" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:353px; left:16px;"> <a href="forum.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Forum','','images/forum_on.gif',1)"><img src="images/forum_off.gif" alt="Forum" name="Forum" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:392px; left:16px;"> <a href="trade.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Trade','','images/trade_on.gif',1)"><img src="images/trade_off.gif" alt="Trade" name="Trade" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:431px; left:16px;"> <a href="media.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Media','','images/media_on.gif',1)"><img src="images/media_off.gif" alt="Media" name="Media" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; bottom:0px; right:20px;"><a href="http://127.0.0.1/index.php"><img src="images/forum_up.gif" width="19" height="18" border="0"></a></div>
    
    <div align="justify" STYLE="position:absolute; bottom:35px; left:0px;"> <a href="http://www.imc.co.kr/" target="_blank"><img src="images/imc_games_logo.gif" width="160" height="25" border="0" align="absbottom"></a> </div>
    <div> <a href="http://www.hanbitsoft.co.kr/eng/company/company.asp" target="_blank"><img src="images/hanbit_soft_logo.gif" width="160" height="35" border="0" align="justify" style="position:absolute; bottom:0px; left:0px;"></a> </div>
    Can anyone help? Also can anyone tell me why people even bother with IE when it does crap like this just to annoy the hell out of designers. -_-!

    But seriously any help on this would be great, thanks.

  2. #2
    Join Date
    Apr 2003
    Location
    Netherlands
    Posts
    21,654
    A link would be more useful.
    At least 98% of internet users' DNA is identical to that of chimpanzees

  3. #3
    Join Date
    May 2005
    Posts
    2,040
    why people even bother with IE when it does crap like this just to annoy the hell out of designers.
    Because most users use what is given to them and not what is best for them.

  4. #4
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    Quote Originally Posted by drhowarddrfine
    Because most users use what is given to them and not what is best for them.
    Like school dinners, but all the rebel's bring packed lunches.
    Every fight is a food fight when you’re a cannibal.

  5. #5
    Join Date
    Oct 2005
    Location
    UK
    Posts
    630
    Quote Originally Posted by Choix
    Can anyone help? Also can anyone tell me why people even bother with IE when it does crap like this just to annoy the hell out of designers. -_-!
    try validating the code to html 4.01 strict and if the problem persists ill try to help more

    people use IE as it comes with windows and i must admit i click on IE on the quicklaunch sometimes rather than firefox as it loads a bit quicker if i just want to run a quick search.

    does the page have a doctype as well as IE sometimes messes up if you dont include this

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">

  6. #6
    Join Date
    May 2005
    Posts
    2,040

  7. #7
    Join Date
    Dec 2005
    Posts
    27
    Thanks, yes I have tried the code:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    There where no changes at all to the site in IE.

    I cannot provide a link because its on my localhost right now however:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
    "http://www.w3.org/TR/html4/strict.dtd">
    <html>
    <head>
    <title>Grando Espada Aldea! - Community Forums</title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"><style type="text/css">
    <!--
    body {
    	background-color: #EBDCCC;
    }
    -->
    </style>
    <script language="JavaScript" type="text/JavaScript">
    <!--
    function MM_swapImgRestore() { //v3.0
      var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
    }
    
    function MM_preloadImages() { //v3.0
      var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
        var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
        if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
    }
    
    function MM_findObj(n, d) { //v4.01
      var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
        d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
      if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
      for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
      if(!x && d.getElementById) x=d.getElementById(n); return x;
    }
    
    function MM_swapImage() { //v3.0
      var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
       if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
    }
    //-->
    </script>
    </head>
    <body style="height:100%; " onLoad="MM_preloadImages('images/home_on.gif','images/forum_on.gif','images/database_on.gif','images/news_on.gif','images/trade_on.gif','images/media_on.gif')">
    
    	<div align="center" style="position:absolute; top:0px; left:159px; right:0px; height:99.5%;"><iframe src="http://127.0.0.1" style="width:100%; bottom:0px; height:99.5%;"></iframe></div>
    
        <div align="center" STYLE="position:absolute; top:0px; left:326px;"> <img src="images/banner_spacer.gif" width="400" height="136"></div>
        <div align="center" STYLE="position:absolute; top:0px; left:342px;"> <img src="images/banner.gif" width="684" height="136" align="right"></div>
    
    <div align="center" STYLE="position:absolute; top:136px; left:158px;"> <img src="images/nav_arch.gif" width="157" height="202"></div>
    <div align="center" STYLE="position:absolute; top:136px; left:0px;"> <img src="images/nav_top.gif" width="160" height="202"></div>
    <div align="center" STYLE="position:absolute; top:288px; left:0px; bottom:0px;"> <img src="images/nav_bottom.gif" width="160" style="height:100%;"></div>
    <div align="center" STYLE="position:absolute; top:0px; left:0px;"> <a href="index.htm"><img src="images/title.gif" width="326" height="136" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:236px; left:16px;"> <a href="index.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('home','','images/home_on.gif',1)"><img src="images/home_off.gif" name="home" width="113" height="45" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:275px; left:16px;"> <a href="news.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('News','','images/news_on.gif',1)"><img src="images/news_off.gif" alt="News" name="News" width="128" height="39" border="0"></a> </div>
    <div align="center" STYLE="position:absolute; top:314px; left:16px;"> <a href="#" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('database','','images/database_on.gif',1)"><img src="images/database_off.gif" name="database" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:353px; left:16px;"> <a href="forum.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Forum','','images/forum_on.gif',1)"><img src="images/forum_off.gif" alt="Forum" name="Forum" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:392px; left:16px;"> <a href="trade.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Trade','','images/trade_on.gif',1)"><img src="images/trade_off.gif" alt="Trade" name="Trade" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; top:431px; left:16px;"> <a href="media.htm" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Media','','images/media_on.gif',1)"><img src="images/media_off.gif" alt="Media" name="Media" width="128" height="39" border="0"></a></div>
    <div align="center" STYLE="position:absolute; bottom:0px; right:20px;"><a href="http://127.0.0.1/index.php"><img src="images/forum_up.gif" width="19" height="18" border="0"></a></div>
    
    <div align="justify" STYLE="position:absolute; bottom:35px; left:0px;"> <a href="http://www.imc.co.kr/" target="_blank"><img src="images/imc_games_logo.gif" width="160" height="25" border="0" align="absbottom"></a> </div>
    <div> <a href="http://www.hanbitsoft.co.kr/eng/company/company.asp" target="_blank"><img src="images/hanbit_soft_logo.gif" width="160" height="35" border="0" align="justify" style="position:absolute; bottom:0px; left:0px;"></a> </div>
    
    
    </body>
    </html>
    This is the entire page code I didn't think you would need to see it all for a possible solution.

    Thanks in advance if anyone has a clue how to fix this.

  8. #8
    Join Date
    Dec 2005
    Posts
    27
    Up!

    Sorry if this is considered spam but I guess its better than posting it again after a week of no replies.

  9. #9
    Join Date
    Dec 2002
    Location
    Manchester, UK
    Posts
    6,276
    Upload a .zip that includes everything, including images, I'll remake the menu.
    Every fight is a food fight when you’re a cannibal.

  10. #10
    Join Date
    Dec 2005
    Posts
    27
    If you really can then that would be great, to tell you truth im lost on it. I barely know enough to design it let alone work around stupid IE bugs .

    By the way nice to see you live in Manchester I used to live there, well stockport but you know close enough.

    Thanks for the help.
    Attached Files Attached Files

  11. #11
    Join Date
    Jan 2006
    Posts
    18
    Quote Originally Posted by Choix
    I barely know enough to design it let alone work around stupid IE bugs .
    Thats 99% of your problem. Working out the differences between IE and FF will greatly help you along the way to cross browser compatablity.. IE is'nt all that bad. My pages display the same in all the browsers I test in, However tweaking is needed. One attribute may meaningless to one browser where another will require it to display as desired.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  
HTML5 Development Center



Recent Articles