Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Oct 2005
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Cool Page fine in Firefox/Opera but wrong in IE

    Hi everyone,

    For whatever reason, this one page out of all the rest of my site will not layout correctly in IE, but be ok in both Firefox and Opera. Why is this so?

    www.ncsmtg.com/documents4.htm

    Here's the code:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"
    >
    <html>
    
    <head>
    <meta name="GENERATOR" content="Microsoft FrontPage 5.0">
    <meta name="ProgId" content="FrontPage.Editor.Document">
    <meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
    <title>NCS Mortgage - We finance your future, not your past</title>
    <link rel="stylesheet" type="text/css" href="styles2.css">
    <script language="JavaScript" type="text/javascript">
    </script>
    </head>
    
    <body bgcolor="#FFFFFF">
    
    <table height="100%" cellspacing="0" cellpadding="0" align="center">
      <tr>
        <td>
        <div id="header">
          <div id="menubar">
            <a id="home" href="index.htm">
            <img src="images/menu/home-blank.gif" alt="Home" width="100" height="100"></a>
            <a id="mortgage" href="mortgage-process.htm">
            <img src="images/menu/mortgage-process-blank.gif" alt="Mortgage Process" width="200" height="100"></a>
            <a id="financial" href="financial-calculators.htm">
            <img src="images/menu/financial-calculators-blank.gif" alt="Financial Calculators" width="220" height="100"></a>
            <a id="apply" href="apply.htm">
            <img src="images/menu/apply-blank.gif" alt="Apply" width="80" height="100"></a>
            <a id="glossary" href="glossary.htm">
            <img src="images/menu/glossary-blank.gif" alt="Financial Calculators" width="200" height="100"></a>
          </div>
          <div id="logo1">
            <!-- URL's used in the movie-->
            <!-- text used in the movie-->
            <!--NCSWe finance your future, not your pastNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCSNCS-->
            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="800" HEIGHT="150" id="logo" ALIGN>
              <param NAME="movie" VALUE="logo/logo.swf">
              <param NAME="loop" VALUE="false">
              <param NAME="quality" VALUE="high">
              <param NAME="bgcolor" VALUE="#FFFFFF">
              <embed src="logo/logo.swf" loop="false" quality="high" bgcolor="#FFFFFF" WIDTH="800" HEIGHT="150" NAME="logo" ALIGN TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
              
              
              
              
              
              
              
              
              
              
              
              
              
              
              
              
              
              
            
              </embed></object>
          </div>
        </div>
        </td>
      </tr>
      <tr>
        <td>
        <div id="container">
          <div id="navigation">
            <!-- URL's used in the movie-->
            <!-- text used in the movie-->
            <!--SincerityDignitySimplicityThe Values of NCS Mortgage:Sincerity, Dignity, SimplicityWhether you arepurchasing, refinancing,or consolidating debtNCS Mortgage will findthe best mortgage planfor you...Our Promise-->
            <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" WIDTH="200" HEIGHT="200" id="values" ALIGN>
              <param NAME="movie" VALUE="values.swf">
              <param NAME="quality" VALUE="high">
              <param NAME="bgcolor" VALUE="#0099CC">
              <embed src="values.swf" quality="high" bgcolor="#0099CC" WIDTH="200" HEIGHT="200" NAME="values" ALIGN TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer">
              
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
            
              </embed></object>
            <img src="images/take-advantage.jpg" alt="Take advantage now of timely approvals, low rates, and quick closings.  Explore our site and learn.  Pre-qualify yourself, apply online, and collect the necessary documents to get the loan approved." width="200" height="200">
            <div id="navcontainer">
    &nbsp;&nbsp;&nbsp; Our Company
              <ul id="navlist">
                <li><a href="about.htm" class="navnews">About Us</a></li>
                <li><a href="contact.htm" class="navnews">Contact Us</a></li>
                <li><a href="employment.htm" class="navnews">Employment</a></li>
              </ul>
            </div>
          </div>
          <div id="content">
            <img src="images/header-mortgage-process.jpg" class="heading" alt="Mortgage Process" width="295" height="58">
            <img src="images/documents.jpg" class="pic" alt="Documents" width="250" height="167">
            <p><a href="mortgage-process.htm" class="acontent">Back to Mortgage Main 
            Page</a></p>
            <h2><a name="top">Mortgage Loan Education</a></h2>
            <p>The following is an outline of the process of a mortgage loan. It is 
            good to read this guideline in order to be better prepared and to understand 
            how you will accomplish buying a new home or to refinance. </p>
            <img src="images/stepsmortgage.jpg" alt="Steps In The Mortgage Process" width="360" height="43">
            <div id="steps">
              <a id="step1" href="#1">
              <img src="images/steps/blank1.gif" width="108" height="144"></a>
              <a id="step2" href="#2">
              <img src="images/steps/blank2.gif" width="108" height="144"></a>
              <a id="step3" href="#3">
              <img src="images/steps/blank3.gif" width="119" height="144"></a>
              <a id="step4" href="#4">
              <img src="images/steps/blank4.gif" width="108" height="144"></a>
              <a id="step5" href="#5">
              <img src="images/steps/blank5.gif" width="108" height="144"></a>
            </div>
            <div id="firststep">
              <p class="quasihead"><a name="1">Organize your documents</a></p>
              <div id="mquote">
                <h4>For purchases and refinancing:</h4>
                <ul id="regularlist">
                  <li>For salaried workers: provide two years W-2 and one month of pay 
                  stubs.</li>
                  <li>For the self-employed: provide two years tax returns and a YTD 
                  profit and loss statement.</li>
                  <li>For rental property owners, provide the rental agreements and 
                  two years tax returns</li>
                              </ul>
                <h4>For home equity loans:</h4>
                <ul id="regularlist">
                  <li>For salaried workers: provide two years W-2 and one month of pay 
                  stubs.</li>
                  <li>For the self-employed: provide two years tax returns and a YTD 
                  profit and loss statement.</li>
                  <li>For rental property owners, provide the rental agreements and 
                  two years tax returns</li>
                  <li>Provide a copy of the note from your first mortgage. This is usually 
                  included within the closing loan documents</li>
                  <li>Please provide a letter with an explanation of your plan for the 
                  proceeds. This must include your signature.</li>
                  <li>Please provide a copy of divorce decree (if you are divorced).</li>
                  <li>For those that are NOT US citizens, provide us with a copy of 
                  your green card (both front and back)</li>
                  <li>For those that are NOT permanent residents, provide us with your 
                  H-1 or L-1 Visa.</li>
                </ul>
                <a href="#top">[Return to top]</a>
              </div>
            </div>
            <div id="secondstep">
              <p class="quasihead"><a name="2">Become qualified</a></p>
              <p>Becoming qualified before you apply for a loan predicts how much you 
              will be able to borrow. Whenever you buy a house, you will either be pre-qualified 
              or pre-approved. Usually, you can get pre-qualified over the telephone 
              or on the internet in a few minutes. A pre-qualification does not have 
              the advantages of a pre-approval. This is because the pre-approval process 
              is more rigorous and involves the verification of you credit, income, 
              assets and liabilities. It is best that you become pre-approved before 
              you start looking for a home. This benefits you because: </p>
              <div id="mquote">
                <ul id="regularlist">
                  <li>It determines what kind of house you can afford. This reduces 
                  wasted time looking for properties not in your price region.</li>
                  <li>It makes you more valuable to the seller when you are in negotiations. 
                  The seller feels more comfortable that your loan is approved.</li>
                  <li>The loan will close faster because it is already approved.</li>
                </ul>
                <a href="#top">[Return to top]</a>
              </div>
            </div>
            <div id="thirdstep">
              <p class="quasihead"><a name="3">Browse different loan programs and 
              rates</a></p>
              <div id="mquote">
                <h4>To browse and find the best loan for you, you need to:</h4>
                <ul id="regularlist">
                  <li><span class="highlightedpoint">Figure out how long you plan to 
                  keep that loan.</span> If you are thinking of selling the house in 
                  the near future, you may want to consider an adjustable or balloon 
                  loan. Otherwise, if you plan on keeping the house for a longer period 
                  of time, you will want to look at fixed loans.</li>
                  <li><span class="highlightedpoint">Be conscious of the relationship 
                  between rates and points.</span> Points are defined to be prepaid 
                  interest and are tax deductible. Each point equals one percent of 
                  the loan. For example, 1 point on a $135,000 loan is $1,350. As you 
                  pay more points, you will receive a lower rate.</li>
                  <li><span class="highlightedpoint">Compare each program.</span> Shopping 
                  for a loan is a difficult task. So many programs exist that it is 
                  hard to decide which is best for you. It is at this point that one 
                  of our experienced mortgage professionals can help you make an informed 
                  decision that best suits your needs. </li>
                </ul>
                <a href="#top">[Return to top]</a>
              </div>
            </div>
            <div id="fourthstep">
              <p class="quasihead"><a name="4">Goal: Loan Approval!</a></p>
              <p>As soon as we receive your loan application, we will start the loan 
              approval process immediately. At this point, we verify your credit history, 
              employment history, assets (bank accounts, stocks, mutual funds and retirement 
              accounts), and property value.</p>
              <p>Depending on your specific situation, additional documents or verifications 
              may be needed. In order to increase the chance to approve your loan, you 
              must: </p>
              <div id="mquote">
                <ul id="regularlist">
                  <li>Completely fill out the loan application.</li>
                  <li>Respond immediately to any request for supplementary documents. 
                  This is especially important when your rate is locked or if you have 
                  a specified closing date.</li>
                  <li>Do not make any another major purchases. Major purchases includes 
                  cars, furniture, or another house. These only cause your debts to 
                  increase and may negatively affect your current application. After 
                  you close, it is safe to make any major purchase you like.</li>
                  <li>Do not move money into your bank accounts unless it can be traced. 
                  If you are about to receive any money from friends or family, please 
                  contact us as soon as possible.</li>
                  <li>Do not make any plans to leave town around the expected closing 
                  date. If you do have plans to be out of town, you may sign a power 
                  of attorney to authorize another individual to sign on your behalf.</li>
                </ul>
                <a href="#top">[Return to top]</a>
              </div>
            </div>
            <div id="fifthstep">
              <p class="quasihead"><a name="5">Close your loan</a></p>
              <p>Once your loan becomes approved, the final loan documents must be signed 
              by you. This usually happens in front of a notary public. Be ready to:
              </p>
              <div id="mquote">
                <ul id="regularlist">
                  <li>Bring a cashiers check for your down payment and closing costs 
                  if they are required. Personal checks are not usually accepted.</li>
                  <li>Examine the final loan documents. Verify that the interest rate 
                  and loan terms are what were promised to you. Also, it is very important 
                  that you make certain that the name and address on the loan documents 
                  are accurate.</li>
                  <li>Sign the loan documents.</li>
                </ul>
                <p>Your loan should close soon after you sign the loan documents. According 
                to federal law, for refinance and home equity loan transactions, you 
                have 3 days to review the documents before your loan transaction can 
                close. </p>
                <a href="#top">[Return to top]</a>
              </div>
            </div>
            <img src="images/equal-housing.gif" class="housing" alt="Equal Housing Lender" width="58" height="48">
            <p>&nbsp;</p>
          </div>
        </div>
        </td>
      </tr>
      <tr>
        <td style="vertical-align: bottom">
        <div id="footer" class="center">
          Copyright [2004] [<span class="insideBracket">NCS Mortgage Corporation</span>].&nbsp; 
          All Rights Reserved
        </div>
        </td>
      </tr>
    </table>
    
    </body>
    
    </html>
    Here's the CSS:

    Code:
    html, body {
    	margin: 0;
    	padding: 0;
    	height: 100%;
    	text-align: center;
    	font-family: times;
    	color: #000000;
    	background-image: url('images/brick.gif');
    	}
    	
    p {
    	color: black;
    	font-family: times;
    	font-size: 12pt;
    	margin: 15px;
    	}
    	
    .asterisk {
    	color: red;
    }
    
    h2 {
    	color: blue;
    	margin: 10px;
    	}
    	
    h3 {
        color: gray;
    	 margin: 10px;
        }	
    
    .center {
    	text-align: center;
    	}
    	 
    /* main grid */
    	
    #header {
    	margin: 0 auto;
    	width: 800px;
    	}
    	
    #content {
    	float: right;
    	padding: 0px;
    	margin: 0px;
    	width: 600px;
    	height: 100%;
    	background-color: #fff;
    }	
    
    #navigation {
    	float: left;
    	margin: 0px;
    	padding: 0px;
    	width: 200px;
    	height: 100%;
       color: #fff;
    	background-color: #09c;
    }
    
    #footer {
    	margin: 0px;
    	width: 800px;
    	position: relative;
    	bottom: 0px;
    	background-color: #00FFFF;
    	clear: both;
    	}
    	
    #container {
    	margin: 0 auto; 
    	width: 800px;
    	height: 100%;
    	text-align: left;
    	position: relative;
    	padding: 0;
    	background-color: #fff;
    	background: url('images/column-background.jpg') repeat-y 0;
    	}
    	
    /* divs for header */
    
    #logo1 {
    	border: solid thin #0099CC;
    	border-width: 1px;
    }
    
    /*divs for navigation bar */
    #navlist {
    	list-style: none;
    	}	
    	
    #navlist li {
    	padding-left: 20px;
    	padding-bottom: 5px;
    	background-image: url('images/bullet-news.jpg');
    	background-repeat: no-repeat;
    	}
    	
    A.navnews:link {color: #FFFFFF; text-decoration: none}
    A.navnews:visited {color: #FFFFFF; text-decoration: none}		
    A.navnews:hover {color: #8b008b; text-decoration: underline}
    A.navnews:active {color: #FFFFFF; text-decoration: none}
    
    /*divs for content */
    
    .heading {
       float: left;
    	margin: 10px;
    }
    	
    .pic {
       float: right;
    	margin: 10px;
    }
    
    .highlight {
       padding: 5px;
    	margin: 20px;
    }
    
    .housing {
       float: left;
    	margin: 10px;
    }
    
    .seal {
       float: right;
    	margin: 10px;
    }
    
    #regularlist {
    	list-style: none;
    	}	
    	
    #regularlist li {
    	padding-left: 20px;
    	margin-left: -40px;
    	padding-bottom: 10px;
    	background-image: url('images/bullet.jpg');
    	background-repeat: no-repeat;
    	}
    
    #columnleft {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	width: 300px;
    	float: left;
    	}
    	
    #columnright {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	width: 250px;
    	float: right;
    	}
    
    p.quasihead{
    	color: black;
    	font-family: times;
    	font-size: 20pt;
    	margin: 15px;
    	}
    	
    A.acontent:link {color: #0000FF; text-decoration: underline}	
    A.acontent:visited {color: #8b008b; text-decoration: underline}		
    A.acontent:hover {color: #8b008b; text-decoration: underline}	
    A.acontent:active {color: #0000FF; text-decoration: underline}
    
    #mquote {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	float: left;
    	}
    	
    #steps {
    	margin: 0px;
    	padding: 15px;
    	background-color: #FFFFFF;
    	float: left;
    }
    
    .highlightedpoint {
    	font-weight: bold;
    }
    
    #solopicture {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	width: 500px;
    	float: left;
    }
    
    .faq {
    	color: #8b008b;
    	font-weight: bold;
    }
    
    /* form divs */
    
    form p {
       width: 550px;
       clear: both;
    }
    
    form p label {
       display: inline;
       float: left;
       width: 330px;
    }
    
    form p input, form p textarea, form p select {
       margin: 0;
    }
    
    /* divs for footer */
    
    .insideBracket {
    	color: blue;
    }
    
    /* divs for hovers */
    
    a img {
    	border-width: 0;
    	background: top left no-repeat;
    	margin: -2;
    }
    
    a#home img {background-image: url(images/menu/home.jpg);}
    a#mortgage img {background-image: url(images/menu/mortgage-process.jpg);}
    a#financial img {background-image: url(images/menu/financial-calculators.jpg);}
    a#apply img {background-image: url(images/menu/apply.jpg);}
    a#glossary img {background-image: url(images/menu/glossary.jpg);}
    
    a#home:hover img {background-image: url(images/menu/home2.jpg);}
    a#mortgage:hover img {background-image: url(images/menu/mortgage-process2.jpg);}
    a#financial:hover img {background-image: url(images/menu/financial-calculators2.jpg);}
    a#apply:hover img {background-image: url(images/menu/apply2.jpg);}
    a#glossary:hover img {background-image: url(images/menu/glossary2.jpg);}
    
    a#step1 img {background-image: url(images/steps/step1.jpg);}
    a#step2 img {background-image: url(images/steps/step2.jpg);}
    a#step3 img {background-image: url(images/steps/step3.jpg);}
    a#step4 img {background-image: url(images/steps/step4.jpg);}
    a#step5 img {background-image: url(images/steps/step5.jpg);}
    
    a#step1:hover img {background-image: url(images/steps/step1b.jpg);}
    a#step2:hover img {background-image: url(images/steps/step2b.jpg);}
    a#step3:hover img {background-image: url(images/steps/step3b.jpg);}
    a#step4:hover img {background-image: url(images/steps/step4b.jpg);}
    a#step5:hover img {background-image: url(images/steps/step5b.jpg);}

  • #2
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Location
    Lancaster, UK
    Posts
    1,134
    Thanks
    1
    Thanked 57 Times in 55 Posts
    Something confuses me here. CSS based coding is great when used for styling and positioning elements on a page and gets rid of a need for tables to aid layout. So why oh why do people still use tables to surround the CSS styled elements that should be placed where they are because of their positioning in the CSS and not placement in a table?

    Is mixing the two a bad practise? I know it validates a page, but surely new W3C Web Thingies say that the need for tables, other than for an actual table in a form or something are unneeded?

    Help me out here?

    And could you explain why it doesn't display correctly? What exactly is it doing wrong? Thank you
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  • #3
    New Coder
    Join Date
    Oct 2005
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Minimal Tables with CSS is ok

    Read this article. It says mimimal tables with CSS is ok. This is what I followed. http://developer.apple.com/internet/...estwebdev.html

    Now, can someone help me out?

  • #4
    Supreme Master coder! _Aerospace_Eng_'s Avatar
    Join Date
    Dec 2004
    Location
    In a place far, far away...
    Posts
    19,291
    Thanks
    2
    Thanked 1,043 Times in 1,019 Posts
    We could but you still haven't told us exactly WHAT is wrong with layout. What isn't showing up properly.

    I still don't think you have a valid reason for using tables. Everything they said that could be done with tables can be done with CSS alone and it won't bloat your code.
    ||||If you are getting paid to do a job, don't ask for help on it!||||

  • #5
    New Coder
    Join Date
    Oct 2005
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts
    In IE, this page grows too long. All the content ends up being somewhere in the middle of the page. So, when you go to this page, you have to scroll forever to find the content. I tested this on both my work computer and my home computer. Same thing. You'll probably see the same thing when you click on the link. www.ncsmtg.com/documents4.htm

    As for why I still have tables. This company ABSOLUTELY needs their site up and running. I am working on a full CSS layout, but whenever I try to do this, everything goes to hell. I'm almost there, though. So for now, I will have minimal tables. But, a full CSS version is on its way.


  •  

    Posting Permissions

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