Hey there,

I had to place an include statement inside a div and style the div with negative top margin in order to remove some unwanted white space mysteriously created between the include statement and the image right before it. Why'd I have to do that? Is that normal practice or behavior for include statements? Here's my code just so you can se what I did. Thanks in advance for your time.

<!DOCTYPE html>
<html>
<head>
<!--<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />-->
<meta name="keywords" content="INCE, International Nusring Education COnsortium, nursing, study abroad, dominican republic, haiti, dr. mildred fennal, mildred fennal">
<meta name="description" content="INEC is Nurses preparing to serve a global society through study abroad">
<title>INEC...International Nursing Education Consortium</title>
<link href="inec.css" rel="stylesheet" type="text/css">
<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/button-hover.png')">
<div id="header">
<div id="left"> <a href="index.php"><img src="images/INEC-logo.png" width="118" height="97"></a>
<div>Nurses preparing to serve a global society through study abroad</div>
</div>
<div id="inec">
<div>International Nursing Education Consortium</div>
<a href="inec-study-abroad.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('study abroad button','','images/button-hover.png',1)"><img src="images/button.png" alt="press to study abroad with inec" name="study abroad button" width="108" height="28" border="0"></a> </div>
</div>
<!--<div class="clear"></div>
--><div id="main">
<img src="images/bigpic.jpg" width="686" height="306" alt="register to study abroad">
<div style="margin-top:-6px"><?php include 'menu.html';?></div>
</div>
<div class="feature" style="margin-left:100px">
<h1>Study Abroad</h1>
<img src="images/study_abroad.jpg">
<p>
Dr. Mildred Fennal is no stranger to study abroad for nurses. Dr. Fennal made history by internationalizing the nursing curriculum at South Carolina State University, and taking undergraduate nursing students abroad.
</p>
<div class="readmore"><a href="#">Read More >>></a></div>
</div>
<div class="feature">
<h1>Who We Are</h1>
<div id="initials">
<img src="images/inec_initials.gif">
</div>
<p>
The International Nursing Education Consortium is a new innovative program involving nurses at all levels. The program provides methodology for education, practice and research as a study abroad experience.
</p>
<div class="readmore"><a href="inec-about-us.php">Read More >>></a></div>
</div>
<div class="feature">
<h1>Visit the Dominican</h1>
<img src="images/visit_the_dominican.jpg">
<p>
A visit to the Dominican Republic to establish relationships,  obtain clinical space, and meet with government and non-government agencies was completed in 2008. During the visit a partnership was established ....
<div class="readmore"><a href="inec-current-projects.php">Read More >>></a></div>
</div>
</body>
</html>

Recommended Answers

All 2 Replies

Member Avatar for diafol

To aid those wondering where the include file is - it's at line 45:

<div id="main">
<img src="images/bigpic.jpg" width="686" height="306" alt="register to study abroad">
<div style="margin-top:-6px"><?php include 'menu.html';?></div>
</div>

Space may be due to img - if it's block display. Does the iumage have padding or margin attached to it?
The menu.html may have padding or margin attached to it?

If you have Chrome, have a look at "View page source" to see if there are any newlines or hard breaks. Newlines shouldn't really have any effect.
I'm assuming that this is going to be down to styling. Have a look at "Inspect Element" (right click on the page in Chrome) and have a look at the resolved CSS. You can drill down the html elements and see where the margin / padding is set.

It could even be due to line-spacing, but unlikely.

A definitive answer would be quicker if this was up somewhere that we could see the page and get an idea on what the source looked like.

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.