Solved

HTML problem in IE - too much space on top

Posted on 2007-03-28
1
189 Views
Last Modified: 2008-02-01
I have an HTML page which in IE7 has slightly more space on top above the table than in Firefox. I would like to get rid of this tiny added space in IE. This is the source 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=ISO-8859-1" />
<title>Solaria home</title>
<style type="text/css">
<!--
body {
      background-color: #8f897b;
}
.bodytext {
      font-size: 14px;
      color: #FFFFFF;
      font-family: Arial, Helvetica, sans-serif;
      font-weight: lighter;
      line-height: 15pt;
      font-style: normal;
}
.style12 {font-size: 21px; color: #FFFFFF; font-family: Arial, Helvetica, sans-serif; font-weight: lighter; line-height: 21pt; font-style: normal; }
-->
</style>
<script type="text/JavaScript">
<!--
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_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_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('Solaria Site/images/but_setting_ro.gif','Solaria Site/images/but_home_sel.gif','Solaria Site/images/but_architecture_ro.gif','Solaria Site/images/but_design_ro.gif','Solaria Site/images/but_inquiries_ro.gif')">
<table width="982" height="525" border="1" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td width="250" height="124" rowspan="3"><img src="images/solaria.jpg" width="175" height="84" /></td>
    <td width="732" height="25">&nbsp;</td>
  </tr>
  <tr>
    <td height="42"><table width="617" height="32" border="0" align="right" cellpadding="3" cellspacing="0">
      <tr>
        <td width="135"><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','images/but_home_sel.gif',1)"><img src="images/but_home_sel.gif" name="Image4" width="135" height="35" border="0" id="Image4" /></a><a href="#" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image4','','Solaria Site/images/but_home_sel.gif',1)"></a></td>
        <td width="135"><a href="architecture.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','images/but_architecture_ro.gif',1)"><img src="images/but_architecture.gif" name="Image5" width="135" height="35" border="0" id="Image5" /></a><a href="Solaria Site/architecture.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image5','','Solaria Site/images/but_architecture_ro.gif',1)"></a></td>
        <td width="135"><a href="design.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','images/but_design_ro.gif',1)"><img src="images/but_design.gif" name="Image6" width="135" height="35" border="0" id="Image6" /></a><a href="Solaria Site/design.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image6','','Solaria Site/images/but_design_ro.gif',1)"></a></td>
        <td width="135"><a href="setting.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','images/but_setting_ro.gif',1)"><img src="images/but_setting.gif" name="Image7" width="135" height="35" border="0" id="Image7" /></a><a href="Solaria Site/setting.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image7','','Solaria Site/images/but_setting_ro.gif',1)"></a></td>
        <td width="162"><a href="inquiries.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','images/but_inquiries_ro.gif',1)"><img src="images/but_inquiries.gif" name="Image8" width="162" height="35" border="0" id="Image8" /></a><a href="Solaria Site/inquiries.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image8','','Solaria Site/images/but_inquiries_ro.gif',1)"></a></td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="18">&nbsp;</td>
  </tr>
  <tr>
    <td height="300" colspan="2" align="left" valign="top" bgcolor="#9d978b"><table width="982" height="300" border="0" align="left" cellpadding="0" cellspacing="0">
      <tr>
        <td width="612" height="300"><img src="images/home_images.jpg" width="600" height="400" /></td>
        <td width="381" align="left" valign="top"><table width="359" height="297" border="0" align="center" cellpadding="4" cellspacing="0">
          <tr>
            <td width="351" height="288" valign="top"><p class="style12">Solaria is as common as a once-in-a-decade eclipse over San Francisco. That is to say it's an extraordinary occurrence. </p>
              <p class="bodytext">This new luxury residence is hidden behind private gates between St. Francis Wood and Monterey Heights, exclusive neighborhoods where new construction is nearly unheard of. As a home, Solaria is a symbol of success, not extravagance. It supplies a modern answer to family life, offering privacy and grandness at a scale rarely found within San Francisco limits &ndash; or anywhere else. </p></td>
          </tr>
        </table> </td>
      </tr>
    </table></td>
  </tr>
  <tr>
    <td height="40" colspan="2"><div align="right"><img src="images/footer_floorplan.gif" width="294" height="30" border="0" usemap="#Map4" /></div></td>
  </tr>
</table>

  <map name="Map" id="Map"><area shape="rect" coords="252,4,342,35" href="Solaria Site/gallery.html" />
<area shape="rect" coords="359,6,479,34" href="Solaria Site/floorplans.html" />
<area shape="rect" coords="495,8,605,34" href="mailto:info@acabado.com" />
</map>
<map name="Map2" id="Map2"><area shape="rect" coords="258,3,351,39" href="gallery.html" />
<area shape="rect" coords="378,3,487,37" href="floorplans.html" />
<area shape="rect" coords="506,5,640,37" href="mailto:info@acabado.com" />
</map>
<map name="Map3" id="Map3"><area shape="rect" coords="523,4,625,26" href="mailto:michael@acabado.com" />
<area shape="rect" coords="394,7,507,27" href="floorplans.html" />
<area shape="rect" coords="298,5,377,27" href="gallery.html" />
</map>
<map name="Map4" id="Map4"><area shape="rect" coords="10,4,108,27" href="floorplans.html" />
<area shape="rect" coords="124,4,192,28" href="gallery.html" />
<area shape="rect" coords="210,6,291,30" href="mailto:iinfo@acabado.com" />
</map></body>
</html>
0
Comment
Question by:SWB-Consulting
1 Comment
 
LVL 49

Accepted Solution

by:
Ryan Chong earned 500 total points
ID: 18813287
try define the page's top margin? like change:


body {
      background-color: #8f897b;
}

to:

body {
      background-color: #8f897b;
      margin-top: 10px;
}
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Introduction The Google Maps API offers various ways to draw dynamic and static maps.  Using a combination of PHP and JavaScript, you can draw active JavaScript maps that allow pan-and-zoom in the client browser window.  You can also draw "static" …
Showing your events from Google Calendar in Google Maps Why? I travel all week and I thought it would be ideal if staff in office knew where I was based on my calendar. (OK real reason: my son wanted to see where I would be working, and I thoug…
In this tutorial viewers will learn how to position items using CSS's three positioning types Create a new HTML document with an internal stylesheet.: Create another div in CSS and name it Absolute : Type "position:absolute;" and "top:10px; left:50p…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

910 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

20 Experts available now in Live!

Get 1:1 Help Now