PDA

View Full Version : IE display issue (Big Surprise...)


kona72
05-23-2007, 03:52 PM
Hey All,

Site is developed and live and i missed a design error.

In Firefox... all good..

In IE.. well.... There is a white line that runs just above the navigation area that shouldn't be there. I have tried everything i can think of to fix it but nothing...

Here is the css....



/* commented backslash hack \*/
html, body{
height:100%;
margin:0;
padding:0;
}
/* end hack */

body {
text-align:center;
background-image:url(../images/carly_bg.jpg);
background-repeat: repeat-x;
background-color:#597CA2;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#333333;
}/* centre for ie5.+*/

#outer{
min-height:100%;
height:auto;
width:765px;
background-image:url("../images/carly_bodybg.jpg");
margin-left:auto;/* center it*/
margin-right:auto;/* center it*/
position:relative;
text-align:left;
}

* html #outer{
height:100%;
width:765px;/* box model hack for ie5.+*/
w\idth:765px;
}
#right{
width: 180px;
float:right;
margin-right:15px;
background-image:url("../images/right_bg.jpg");
background-repeat: no-repeat;
padding: 0px 10px;

}

#main {
width: 480px;
padding: 0px 0px 20px 20px;
}
#footer {
width:100%;
position:absolute;
bottom:0;
left:0;
height:50px;
color: #000000;
}
#clearfooter{
clear:both;height:50px;width:100%;
}

#footer_text{
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #333333;
text-align: center;
width: 100%;
}

div>p {
margin:0;
}

/* ------------------------NAVIGATION BAR ----------------------*/

#navigation{
background: #999999;
background-image:url("../images/carly_nav_bg.jpg");
width: 680px;
height:39px;
text-align: left;
padding:24px 60px 0px 25px;
}

#navigation a {
color: #FFFFFF;
text-decoration:none;
font-weight: bold;
}
#navigation a:link {
color: #FFFFFF;
text-decoration: none;
font-weight: bold;
}
#navigation a:hover {
color: #0099FF;
font-weight: bold;
}


/* -------------------------------Typography ----------------*/

a:link {
color: #000000;
text-decoration: none;
font-weight: bold;
}
a:visited {
text-decoration: none;
color: #000000;
font-weight: bold;
}
a:hover {
text-decoration: underline;
color: #FF9933;
font-weight: bold;
}
a:active {
text-decoration: none;
color: #000000;
font-weight: bold;
}

.heading_text{
font-size:16px;
font-weight:bold;
color:#006699;
}
.body_text{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
color:#333333;
}
.subheading{
font-weight:bold;
color:#006699;
}
.blog_heading{
font-weight:bold;
color:#006699;
padding: 2px 5px 2px 5px;
height: 20px;
width: 400px;
background: #FFFFCC;
border: thin dotted #999999;
}





Here is a page if you like...


<!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>
<title>Carly Henry==-----</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="css/carly.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="outer">
<?php include("header.php"); ?>
<div id = "navigation"><?php include("nav.php"); ?></div>
<div id="right"><?php include("upcoming.php"); ?></div>
<div id ="main"></div>

<div id="clearfooter"></div>
<div id="footer"><img src="images/carly_11.jpg" alt="Carly Henry" width="765" height="71" border="0" /></div>
</div>
</body>
</html>


Any ideas would be GREATLY Appreciated....

kona72
05-23-2007, 04:31 PM
Fixed!
in the header include i had this...



<a href="index.php"><img src="images/carly_01.jpg" alt="Carly Henry" width="765" height="294" border="0" /></a>



I took out the extra lines and now have this


<a href="index.php"><img src="images/carly_01.jpg" alt="Carly Henry" width="765" height="294" border="0" /></a>

fixed it right up...

domedia
05-23-2007, 07:02 PM
Was it just a linebreak in your code?
Couldn't see any difference on the 2 snippets above.

kona72
05-23-2007, 07:14 PM
Strangest thing.. it was actually just extra white space...

See screen shots for better explanation. I don't know why... but it worked.

PS (fixed is the new one that works.)