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 2 of 2
  1. #1
    New Coder
    Join Date
    Oct 2005
    Posts
    38
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Netscape Display not correct in IE

    Hi everyone,

    Here's the page: www.ncsmtg.com/documentstest.htm

    #navigation gets smaller underneath the Flash file in IE. I'm not sure why. It looks perfect in both Firefox and Opera.

    I noticed during editing, when I took out <div id="fourthstep"> and <div id="fifthstep"> plus both of their content, the page looks fine in all browsers. It was also fine when I added <div id="fourthstep"></div>. As soon as I added a paragraph of text in <div id="fourthstep">, #navigation gets pushed in again in IE. What's going on?

    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;
    	background-color: #fff;
    }	
    
    #navigation {
    	float: left;
    	margin: 0px;
    	padding: 0px;
    	width: 200px;
       color: #fff;
    	position: absolute;
    }
    
    #footer {
    	margin: 0px;
    	width: 800px;
    	position: relative;
    	bottom: 0px;
    	background-color: #00FFFF;
    	clear: both;
    	}
    	
    #container {
    	margin: 0 auto; 
    	width: 800px;
    	text-align: left;
    	position: relative;
    	padding: 0;
    	background-color: #fff;
    	background: url('images/column-background.jpg') repeat-y 0;
    	}
    	
    #information {
    	margin: 0 auto;
    	width: 800px;
    	text-align: left;
    	position: relative;
    	padding: 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;
    	}
    	
    #regularlist2 {
    	list-style: none;
    	}	
    	
    #regularlist2 li {
    	padding-left: 20px;
    	margin-left: -40px;
    	padding-bottom: 10px;
    	background-image: url('images/bullet.jpg');
    	background-repeat: no-repeat;
    	}
    	
    #regularlist3 {
    	list-style: none;
    	}	
    	
    #regularlist3 li {
    	padding-left: 20px;
    	margin-left: -40px;
    	padding-bottom: 10px;
    	background-image: url('images/bullet.jpg');
    	background-repeat: no-repeat;
    	}
    	
    #regularlist4 {
    	list-style: none;
    	}	
    	
    #regularlist4 li {
    	padding-left: 20px;
    	margin-left: -40px;
    	padding-bottom: 10px;
    	background-image: url('images/bullet.jpg');
    	background-repeat: no-repeat;
    	}
    	
    #regularlist5 {
    	list-style: none;
    	}	
    	
    #regularlist5 li {
    	padding-left: 20px;
    	margin-left: -40px;
    	padding-bottom: 10px;
    	background-image: url('images/bullet.jpg');
    	background-repeat: no-repeat;
    	}
    	
    #regularlist6 {
    	list-style: none;
    	}	
    	
    #regularlist6 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;
    	}
    	
    #mquote2 {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	float: left;
    	}
    	
    #mquote3 {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	float: left;
    	}
    	
    #mquote4 {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	float: left;
    	}
    	
    #mquote5 {
    	margin: 0px;
    	padding: 10px;
    	background-color: #FFFFFF;
    	float: left;
    	}
    	
    #mquote6 {
    	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
    Master Coder Excavator's Avatar
    Join Date
    Dec 2006
    Location
    Alaska
    Posts
    9,695
    Thanks
    22
    Thanked 1,832 Times in 1,816 Posts
    Hello pmontesi,
    I'm not sure but I think
    Code:
    #content {
    	
    	padding: 0px;
    	margin: 0 0 0 200px;
    	width: 600px;
    	background-color: #fff;
    }
    fixes it for me here.
    Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
    Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad


  •  

    Posting Permissions

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