hi, in firefox only, i have a space between the header and the content. i was wondering if anyone can help find out whats wrong, i have tried for a few hours and cant do it. any help greatly appreciated. derek
here is one of the pages that are wrong ..
http://derekvanderven.com/eagle_company/about.html
and here is the css for the page scroll down to about code for more code to that page.
Code:
@charset "utf-8";
/* CSS Document */
body {
margin: 0;
padding: 0;
background-image: url(pattern_156.gif);
background-repeat: repeat;
}
#wrapper {
overflow: auto;
margin: 50px auto 25px auto;
width: 742px;
border: solid white 3px;
}
#header {
margin: 0 auto 0 auto;
width: 736px;
height: 264px;
background-image: url( freedom_header.jpg);
background-repeat: no-repeat;
border: solid white 3px;
}
#nav_rollovers {
float: right;
width: 450px;
height: 30px;
margin-top: 62px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
}
#left_content {
float: left;
width: 400px;
height: 695px;
background-image: url(left_content.gif);
background-position: center top;
border: solid white 2px;
background-repeat: no-repeat;
background-color: white;
}
#left_content p {
text-indent: 20px;
padding-left: 10px;
}
#right_content {
float: left;
width: 334px;
height: 695px;
background-image: url(right_content.gif);
background-position: center top;
border: solid white 2px;
background-repeat: no-repeat;
background-color: white;
}
#right_content p {
text-indent: 20px;
padding-left: 10px;
}
.header_text {
margin: 75px auto 0 50px;
width: 100px;
background-color: #E46732;
color: white;
font-weight: bold;
text-align: center;
padding: 5px;
border: solid black 1px;
}
#workers {
float: left;
margin: 40px auto 0 30px;
width: 150px;
height: 99px;
background-image: url( workers.png);
background-repeat: no-repeat;
}
#keyboard {
float: left;
clear: both;
width: 150px;
height: 112px;
background-image: url( keyboard.png);
background-repeat: no-repeat;
margin-top: 30px;
margin-right: auto;
margin-bottom: 0;
margin-left: 150px;
}
#puzzle {
float: left;
clear: both;
width: 150px;
height: 107px;
background-image: url( puzzle.png);
background-repeat: no-repeat;
margin-top: 30px;
margin-right: auto;
margin-bottom: 0;
margin-left: 40px;
}
#lightbulb {
float: left;
clear: both;
width: 150px;
height: 220px;
background-image: url(lightbulb.png);
background-repeat: no-repeat;
margin-top: 30px;
margin-right: auto;
margin-bottom: 0;
margin-left: 150px;
}
#footer {
margin: 0 auto 0 auto;
width: 100%;
text-align: center;
color: black;
background-color: white;
text-decoration: none;
}
/******************************about code*****************************/
#about_content {
margin: 0 auto 0 auto;
background-color: white;
width: 742px;
height: 695px;
background-image: url( about_content.gif);
background-repeat: no-repeat;
}
#about_text {
width: 300px;
color: black;
margin-top: 75px;
margin-right: auto;
margin-bottom: 0;
margin-left: 50px;
border: solid orange 3px;
padding-top: 30px;
}
#about_text p {
text-indent: 20px;
padding-left: 20px;
padding-right: 20px;
}
#about_image {
float: right;
width: 350px;
height: 247px;
background-image: url(ribbon.png);
background-repeat: no-repeat;
margin-top: 75px;
margin-right: 20px;
margin-bottom: 0;
margin-left: auto;
}
/***********************************services code*******************************/
#services_content {
margin: 0 auto 0 auto;
background-color: white;
width: 742px;
height: 695px;
background-image: url( about_content.gif);
background-repeat: no-repeat;
}
#services_text {
width: 300px;
color: black;
margin-top: 75px;
margin-right: auto;
margin-bottom: 0;
margin-left: 50px;
border: solid orange 3px;
padding-top: 20px;
}
#services_text p {
text-indent: 20px;
padding-left: 20px;
padding-right: 20px;
}
#services_image {
float: right;
width: 350px;
height: 247px;
background-image: url(mother_child.png);
background-repeat: no-repeat;
margin-top: 75px;
margin-right: 10px;
margin-bottom: 0;
margin-left: auto;
}
/***********************************staff code*******************************/
#staff_content {
margin: 0 auto 0 auto;
background-color: white;
width: 742px;
height: 695px;
background-image: url( about_content.gif);
background-repeat: no-repeat;
}
#staff_text {
width: 300px;
color: black;
margin-top: 75px;
margin-right: auto;
margin-bottom: 0;
margin-left: 50px;
border: solid orange 3px;
padding-top: 20px;
}
#staff_text p {
text-indent: 20px;
padding-left: 20px;
padding-right: 20px;
}
#staff_image {
float: right;
width: 350px;
height: 247px;
background-image: url(staff.png);
background-repeat: no-repeat;
margin-top: 75px;
margin-right: 10px;
margin-bottom: 0;
margin-left: auto;
}
/***********************************contact code*******************************/
#contact_content {
margin: 0 auto 0 auto;
background-color: white;
width: 742px;
height: 695px;
background-image: url( about_content.gif);
background-repeat: no-repeat;
}
#contact_text {
width: 300px;
color: black;
margin-top: 75px;
margin-right: auto;
margin-bottom: 0;
margin-left: 50px;
border: solid orange 3px;
padding-top: 20px;
}
#contact_text p {
text-indent: 20px;
padding-left: 20px;
padding-right: 20px;
}
#contact_image {
float: right;
width: 350px;
height: 247px;
margin-top: 75px;
margin-right: 10px;
margin-bottom: 0;
margin-left: auto;
}
and here is the html
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=utf-8" />
<!--[if lt IE 7]>
<link href="iefixes.css" rel="stylesheet" type="text/css" /> <![endif]-->
<link href="eagle.css" rel="stylesheet" type="text/css"/>
<title>Freedom Company Home</title>
<script 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 onload="MM_preloadImages('images_raw/nav_on_slices/home_on.jpg','images_raw/nav_on_slices/about_on.jpg','images_raw/nav_on_slices/services_on.jpg','images_raw/nav_on_slices/staff_on.jpg','images_raw/nav_on_slices/contact_on.jpg')">
<div id="wrapper">
<div id="header">
<div id="nav_rollovers"><a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image1','','images_raw/nav_on_slices/home_on.jpg',1)"><img src="images_raw/nav_off_slices/home_off.jpg" name="Image1" width="79" height="30" border="0" id="Image1" /></a><a href="about.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image2','','images_raw/nav_on_slices/about_on.jpg',1)"><img src="images_raw/nav_on_slices/about_on.jpg" name="Image2" width="92" height="30" border="0" id="Image2" /></a><a href="services.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image3','','images_raw/nav_on_slices/services_on.jpg',1)"><img src="images_raw/nav_off_slices/services_off.jpg" name="Image3" width="90" height="30" border="0" id="Image3" /></a><a href="staff.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images_raw/nav_on_slices/staff_on.jpg',1)"><img src="images_raw/nav_off_slices/staff_off.jpg" name="Image4" width="94" height="30" border="0" id="Image4" /></a><a href="contact.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images_raw/nav_on_slices/contact_on.jpg',1)"><img src="images_raw/nav_off_slices/contact_off.jpg" name="Image5" width="90" height="30" border="0" id="Image5" /></a></div>
</div><!--end header-->
<div id="about_content"> <div class="header_text"> About Us</div>
<div id="about_image"> </div>
<div id="about_text"><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In elementum felis at ipsum tincidunt sodales. Curabitur gravida vestibulum tincidunt. Phasellus vitae quam turpis, ut hendrerit dolor. </p><p>Etiam nisi lorem, consequat id accumsan et, aliquam volutpat nulla. Morbi vel enim sit amet massa mattis sagittis eleifend a risus. Praesent eget est vitae arcu mattis venenatis. Aliquam placerat magna sed elit ornare laoreet. Praesent eleifend, tellus ac facilisis facilisis, neque urna pulvinar diam,</p><p> condimentum volutpat leo justo id ipsum. Phasellus non orci lorem. Vivamus ut lectus nibh, non fringilla nunc. Nullam tempus lectus quis nibh pretium sodales. Etiam ac augue orci. Nullam quis lacus quam, eget dignissim leo.</p> <p> </p>
</div><!--end about text-->
</div>
<!--end about content-->
<div id="footer"> © <a href="http://derekvanderven.com">derekvanderven.com</a> 2009</div>
</div><!--end wrapper-->
</body>
</html>
