[Okta Webinar] Learn how to a build a cloud-first strategyRegister Now

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 190
  • Last Modified:

site broken in all versions of IE.

I have a front end page to some software that renders great except in IE.

I have a background to a table cell that stays within the fixed size of that cell on all browsers except IE, which stretches outside of the cell and pushes the content of the cell out as well.

I'm going nuts trying to figure this out...

You can see it at www (dot) successfulmanifesting (dot) com (slash) minder2 (slash) index.php

Any help fixing this would be most appreciated!  
0
marglar
Asked:
marglar
  • 3
  • 3
  • 3
1 Solution
 
James RodgersWeb Applications DeveloperCommented:
not sure what your seeing but it looks fine in IE, wonky in FF tho

also, posting links like this
www (dot) successfulmanifesting (dot) com (slash) minder2 (slash) index.php
will not help you get responses, makes it hard for respondents to just click on it
0
 
marglarAuthor Commented:
strange.  In every version of IE the "manifestation Minder" logo repeats itself and stretches the cell it is in out of proportion.

In Firefox on the pc and mac it looks fine for me.

That link is successfulmanifesting.com/minder2/    I put it that way before to keep it out of search engine results later.

0
 
James RodgersWeb Applications DeveloperCommented:
your source code is malformed
you have 2 head, 2 title, 2 body and 2 html sections plus 2 doctype declarations
i dont think the style declaration in here will even work, or if it is allowed
<html xmlns="http://www.w3.org/1999/xhtml" style="padding: 0px; margin: 0px">
http://www.blooberry.com/indexdot/html/tagpages/h/html.htm
0
VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

 
marglarAuthor Commented:
whoa.  I'm not sure where that came from!  I'll go clean it out....  I've had a programmer working on the system so they may have accidentally done this.  

Thanks for the feedback, I'll let you know how it goes.

0
 
James RodgersWeb Applications DeveloperCommented:
ok now i see it, in trying to piece together teh link in teh original post i left off teh 2 in minder
0
 
nplibCommented:
Here is the new code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <title>testing minder</title>
      <link href="style.css" rel="stylesheet" type="text/css" media="all" />
      <script type="text/JavaScript">
      <!--
      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 newHeight() {
            var ScreenHeight = screen.height;
            document.getElementById("needsHeight").height = ScreenHeight;
      }
      //-->
      </script>
</head>
<body onload="newHeight();" style="background-image: url(http://www.successfulmanifesting.com/minder2/images/login_page_bar.jpg); background-repeat: repeat-y; margin: 0px;">
      <table width="100%" border="0" align="left" cellpadding="0" cellspacing="0" height="100">
            <tr height="1">
                  <td width="303" height="1" align="left" valign="middle" background="http://www.successfulmanifesting.com/minder2/images/top_left_center_bg.gif">&nbsp;</td>
                  <td width="19" align="left" valign="top" height="1" background="http://www.successfulmanifesting.com/minder2/images/top_left_right_bg.gif">&nbsp;</td>
                  <td  rowspan="3" align="center" valign="top">
                        <table width="490" border="0" cellspacing="5" cellpadding="0">
                              <tr height="19">
                                    <td colspan="3" height="250">
                                          <p align="center"><img src="http://www.successfulmanifesting.com/minder2/images/login/are_you_ready_small.gif" alt="" width="472" height="24" border="0" /><br /></p>
                                                <div align="left">
                                                      <p>Can you imagine how different your life would be if you could remain focused on what you truly want no matter what else is going on?</p>
                                                      <p>Staying focused on those dreams can seem impossible while being constantly distracted by obligations, fears and old habits.</p>
                                                      <p>With the Manifestation Minder, simply write down your goals and be automatically reminded of them during the distractions of your daily life.</p>
                                                      <p>You pick the dream, the Manifestation Minder will keep you focused on making it a reality! </p>
                                                      <hr />
                                                      <p align="center">
                                                            <script type="text/javascript">
                                                                  /***********************************************
                                                                  * Fading Scroller- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
                                                                  * This notice MUST stay intact for legal use
                                                                  * Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
                                                                  ***********************************************/

                                                                  var delay = 7000; //set delay between message change (in miliseconds)
                                                                  var maxsteps=60; // number of steps to take to change from start color to endcolor
                                                                  var stepdelay=60; // time in miliseconds of a single step
                                                                  //**Note: maxsteps*stepdelay will be total time in miliseconds of fading effect
                                                                  var startcolor= new Array(255,255,255); // start color (red, green, blue)
                                                                  var endcolor=new Array(0,0,0); // end color (red, green, blue)

                                                                  var fcontent=new Array();
                                                                  begintag='<div style="font: normal 13px Verdana; padding: 5px;">'; //set opening tag, such as font declarations
                                                                  fcontent[0]="\"The Manifestation Minder has made a significant difference in my life.\" -Rich M. Del Mar, CA";
                                                                  fcontent[1]="\"I wanted to double my monthly sales and I did it in just two months using this system! I would recommend this to anyone wanting to make a real difference in their life!\" -Nichole S. Phoenix, AZ";
                                                                  fcontent[2]="\"I've been using an earlier version of this system for almost two years. I can say for certain that it has made a huge difference for me. It has kept me laser focused on my goals.\" -Jason. Sacramento, CA";
                                                                  closetag='</div>';

                                                                  var fwidth='488px'; //set scroller width
                                                                  var fheight='80px'; //set scroller height

                                                                  var fadelinks=1;  //should links inside scroller content also fade like text? 0 for no, 1 for yes.

                                                                  ///No need to edit below this line/////////////////


                                                                  var ie4=document.all&&!document.getElementById;
                                                                  var DOM2=document.getElementById;
                                                                  var faderdelay=0;
                                                                  var index=0;


                                                                  /*Rafael Raposo edited function*/
                                                                  //function to change content
                                                                  function changecontent(){
                                                                    if (index>=fcontent.length)
                                                                        index=0
                                                                    if (DOM2){
                                                                        document.getElementById("fscroller").style.color="rgb("+startcolor[0]+", "+startcolor[1]+", "+startcolor[2]+")"
                                                                        document.getElementById("fscroller").innerHTML=begintag+fcontent[index]+closetag
                                                                        if (fadelinks)
                                                                          linkcolorchange(1);
                                                                        colorfade(1, 15);
                                                                    }
                                                                    else if (ie4)
                                                                        document.all.fscroller.innerHTML=begintag+fcontent[index]+closetag;
                                                                    index++
                                                                  }

                                                                  // colorfade() partially by Marcio Galli for Netscape Communications.  ////////////
                                                                  // Modified by Dynamicdrive.com

                                                                  function linkcolorchange(step){
                                                                    var obj=document.getElementById("fscroller").getElementsByTagName("A");
                                                                    if (obj.length>0){
                                                                        for (i=0;i<obj.length;i++)
                                                                          obj[i].style.color=getstepcolor(step);
                                                                    }
                                                                  }

                                                                  /*Rafael Raposo edited function*/
                                                                  var fadecounter;
                                                                  function colorfade(step) {
                                                                    if(step<=maxsteps) {
                                                                        document.getElementById("fscroller").style.color=getstepcolor(step);
                                                                        if (fadelinks)
                                                                          linkcolorchange(step);
                                                                        step++;
                                                                        fadecounter=setTimeout("colorfade("+step+")",stepdelay);
                                                                    }else{
                                                                        clearTimeout(fadecounter);
                                                                        document.getElementById("fscroller").style.color="rgb("+endcolor[0]+", "+endcolor[1]+", "+endcolor[2]+")";
                                                                        setTimeout("changecontent()", delay);

                                                                    }
                                                                  }

                                                                  /*Rafael Raposo's new function*/
                                                                  function getstepcolor(step) {
                                                                    var diff
                                                                    var newcolor=new Array(3);
                                                                    for(var i=0;i<3;i++) {
                                                                        diff = (startcolor[i]-endcolor[i]);
                                                                        if(diff > 0) {
                                                                          newcolor[i] = startcolor[i]-(Math.round((diff/maxsteps))*step);
                                                                        } else {
                                                                          newcolor[i] = startcolor[i]+(Math.round((Math.abs(diff)/maxsteps))*step);
                                                                        }
                                                                    }
                                                                    return ("rgb(" + newcolor[0] + ", " + newcolor[1] + ", " + newcolor[2] + ")");
                                                                  }

                                                                  if (ie4||DOM2)
                                                                    document.write('<div id="fscroller" style="border:0px;width:'+fwidth+';height:'+fheight+'"></div>');

                                                                  if (window.addEventListener)
                                                                  window.addEventListener("load", changecontent, false)
                                                                  else if (window.attachEvent)
                                                                  window.attachEvent("onload", changecontent)
                                                                  else if (document.getElementById)
                                                                  window.onload=changecontent
                                                            </script>
                                                      </p>
                                                      <hr />
                                                </div>
                                          </td>
                                    </tr>
                                    <tr height="246">
                                          <td align="left" valign="top" height="246">
                                                <div align="center">
                                                      <img src="http://www.successfulmanifesting.com/minder2/images/login/features.gif" alt="" width="172" height="39" border="0" />
                                                      <ul>
                                                            <li><p align="left"><strong>Easy to use</strong><br />You'll be setup and running in minutes!</p>
                                                            <li><p align="left"><strong>Affordable</strong><br />For less than 12 cents per day you can get the support you need to manifest your lifes passion!</p>
                                                            <li><p align="left"><strong>Always available</strong><br />Messages are delivered where ever you are. Receive them in email or on any text messaging device!</p>
                                                            <li><p align="left"><strong>Flexible</strong><br />Use our professionally written messages or create your own! Change them whenever you like!</p>
                                                      </ul>
                                                </div>
                                          </td>
                                          <td width="1" align="center" valign="top" height="246"></td>
                                          <td align="left" valign="middle" width="229" height="246">
                                                <div align="center">
                                                      <img src="http://www.successfulmanifesting.com/minder2/images/login/cell_user.gif" alt="" width="150" height="224" border="0" />
                                                      <br /><br /><br /><br />
                                                      <a href="http://www.successfulmanifesting.com/minder2/register.php"><img id="signup_button" src="http://www.successfulmanifesting.com/minder2/images/login/signup_button.png" alt="" name="signup_button" width="129" height="38" border="0" /></a>
                                                </div>
                                          </td>
                                    </tr>
                                    <tr>
                                          <td align="center" valign="middle">&nbsp;
                                                <p><img src="http://www.successfulmanifesting.com/minder2/images/login/cell_man.gif" alt="" width="150" height="224" border="0" />
                                                <br /><br /><br />
                                                <a href="http://www.successfulmanifesting.com/minder2/register.php"><img id="signup_button2" src="http://www.successfulmanifesting.com/minder2/images/login/signup_button.png" alt="" name="signup_button2" width="129" height="38" border="0" /></a></p>
                                          </td>
                                          <td width="1"></td>
                                          <td align="left" valign="top" width="229">
                                                <div align="left">
                                                      <img src="http://www.successfulmanifesting.com/minder2/images/login/benefits.gif" alt="" width="172" height="39" border="0" />
                                                </div>
                                                <div align="center">
                                                      <p align="left"><strong>Realize your dreams!</strong><br />Turn your dreams into reality!</p>
                                                      <p align="left"><strong>Enhance Focus</strong><br />Stay focused on your goals through every situation and challenge.</p>
                                                      <p align="left"><strong>Greater Clarity</strong><br />Your intentions are kept clearly defined helping you make powerful decisions that move you closer to your goals.</p>
                                                      <p align="left"></p>
                                                      <p align="left"></p>
                                                </div>
                                          </td>
                                    </tr>
                                    <tr>
                                          <td align="center" valign="middle"></td>
                                          <td width="1"></td>
                                          <td align="left" valign="top" width="229"></td>
                                    </tr>
                              </table>
                        </td>
                  </tr>
                  <tr height="202">
                        <td align="center" valign="bottom" bgcolor="#848484" width="303" height="202" background="http://www.successfulmanifesting.com/minder2/images/login/logo.gif">
                              <form action="" method="post" name="myform" id="myform">
                                    <table width="215" border="0" cellspacing="0" cellpadding="0">
                                          <tr height="25">
                                                <td class="style29" colspan="2" width="215" height="25"><font size="2" color="white">Member Login<input type="hidden" name="action" value="login" /></font></td>
                                          </tr>
                                          <tr>
                                                <td width="81" class="style29"><font color="white">User name:</font></td>
                                                <td width="134" valign="middle"><span class="style6"><input name="username" type="text" size="20" /> </span></td>
                                          </tr>
                                          <tr height="4">
                                                <td width="81" height="4"></td>
                                                <td width="134" height="4"></td>
                                          </tr>
                                          <tr>
                                                <td width="81"><span class="style29"><font color="white">Password:</font></span></td>
                                                <td width="134"><span class="style6"><input name="password" type="password" size="20" /> </span></td>
                                          </tr>
                                          <tr height="4">
                                                <td width="81" height="4"></td>
                                                <td width="134" height="4"></td>
                                          </tr>
                                          <tr>
                                                <td colspan="2" align="left" valign="top" width="215">
                                                      <div align="left">
                                                            <img src="http://www.successfulmanifesting.com/minder2/images/login/login_button.png" onclick="document.myform.submit();" width="59" height="20" align="right" /><a href="http://www.successfulmanifesting.com/minder2/index.php?reset=1"><img src="http://www.successfulmanifesting.com/minder2/images/login/forgot_pw_button.png" alt="" width="100" height="20" align="left" border="0" /></a>
                                                      </div>
                                                </td>
                                          </tr>
                                          <tr height="15">
                                                <td align="left" valign="top" width="215" height="15"></td>
                                                <td align="left" valign="top" width="215" height="15"></td>
                                          </tr>
                                          <tr height="1">
                                                <td colspan="2" align="center" valign="top" width="215" height="1"></td>
                                          </tr>
                                    </table>
                              </form>
                        </td>
                        <td width="19" height="202"><img src="http://www.successfulmanifesting.com/minder2/images/logoshadow.gif" width="19" height="202" /></td>
                  </tr>
                  <tr id="needsHeight">
                        <td align="center" valign="top" bgcolor="#848484" width="303"><img src="http://www.successfulmanifesting.com/minder2/images/login/device_wide.jpg" width="303" height="392" /></td>
                        <td width="19" background="http://www.successfulmanifesting.com/minder2/images/top_left_right_bg.gif">&nbsp;</td>
                  </tr>
                  <tr height="64">
                        <td width="303" height="64" align="center" valign="middle" background="http://www.successfulmanifesting.com/minder2/images/copyright_bg.gif" bgcolor="#848484"><span class="style28">&copy; Copyright 2007 Pacifica Technologies Inc.<br />All Rights Reserved</span></td>
                        <td width="19" height="64"><img src="http://www.successfulmanifesting.com/minder2/images/copyrightshaow_bg.gif" alt="" height="64" width="19" border="0" /></td>
                        <td height="64">&nbsp;</td>
                  </tr>
            </table>
      </body>
</html>
0
 
nplibCommented:
basically I added a javascript function

      function newHeight() {
            var ScreenHeight = screen.height;
            document.getElementById("needsHeight").height = ScreenHeight;
      }

and added that function to the body onload event
<body onload="newHeight();" ......>

Then added the ID attribute to the second to last row of the table

                  <tr id="needsHeight">
                        <td align="center" valign="top" bgcolor="#848484" width="303"><img src="http://www.successfulmanifesting.com/minder2/images/login/device_wide.jpg" width="303" height="392" /></td>
                        <td width="19" background="http://www.successfulmanifesting.com/minder2/images/top_left_right_bg.gif">&nbsp;</td>
                  </tr>

The problem you were experiencing is an issue with table sizing is an issue with IE.
0
 
marglarAuthor Commented:
nplib, that fixed it!  Thank you!


0
 
nplibCommented:
This is what I do.
0

Featured Post

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

  • 3
  • 3
  • 3
Tackle projects and never again get stuck behind a technical roadblock.
Join Now