user379888
Reputation:
Unsual padding in a website
The code below was written by some one else. Instead of using div architecture, he has used tabular architecture. Now after the menu options end, there is a space in between the content of the page and the menu. I have seen the code many a times, checked the stylesheet for padding or margin and observed all the possible reasons that could have caused it but was unable to find the reason for this space. I even tried margin-top:-100px; in the content area to see if it moves above but it still did not moved. I would be very thankful if someone can help me out with it. The website is here.Thanks in advance.
Here is its code,
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Lorem Epsum</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link href="style7.css" rel="stylesheet" type="text/css" />
<script language="Javascript">
if (document.images) {
button1 = new Image
button2 = new Image
button1.src = 'images/contact.png'
button2.src = 'images/contactR.png'
button3 = new Image
button4 = new Image
button3.src = 'images/investor.png'
button4.src = 'images/investorR.png'
button5 = new Image
button6 = new Image
button5.src = 'images/associate.png'
button6.src = 'images/associateR.png'
button7 = new Image
button8 = new Image
button7.src = 'images/services.png'
button8.src = 'images/servicesR.png'
button9 = new Image
button10 = new Image
button9.src = 'images/about.png'
button10.src = 'images/aboutR.png'
}
</script>
<script type="text/JavaScript">
function SendMemId(ID, Name)
{
var MyElement = document.getElementById("tester");
var MyName = document.getElementById("MyNames");
document.getElementById('MyNames').innerHTML = (Name);
MyElement.value = (ID);
return true;
}//-->
</script>
<script src="jquery.js" type="text/javascript"></script>
<script src="popup.js" type="text/javascript"></script>
<script src="js/jquery-1.4.2.js" type="text/javascript"></script>
<script src="js/cufon-yui.js" type="text/javascript"></script>
<script src="js/cufon-replace.js" type="text/javascript"></script>
<script src="js/standard_07_57_400.font.js" type="text/javascript"></script>
<script src="lite_validation.js"></script>
<script>
required.add('name','NOT_EMPTY','Full Name');
required.add('email','EMAIL','Email Address');
required.add('message','NOT_EMPTY','Your Message')
</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js" type="text/javascript" charset="utf-8"></script>
<script src="src/jquery.infieldlabel.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript" charset="utf-8">
<!--
$(function(){ $("label").inFieldLabels(); });
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 id="page2" onLoad="MM_preloadImages('images/aboutR.png','images/servicesR.png','images/associateR.png','images/investorR.png','images/contactR.png')">
<table width="900" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="837"> </td>
</tr>
<tr>
<td valign="bottom" height="120" background="images/headsmall.png"><table width="100%" height="120" border="0" cellpadding="0" cellspacing="0">
<tr>
<td valign="bottom"><div align="left"><a href="index.php"><img src="images/logo.png" alt="" width="210" height="110" style="border-style: none"/></a></div></td>
<td valign="bottom"><table border="0" align="right" cellpadding="0" cellspacing="0">
<tr>
<td><a href="about.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image6','','images/aboutR.png',1)"><img src="images/about.png" width="115" height="50" border="0" id="Image6" /></a></td>
<td><a href="services.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image5','','images/servicesR.png',1)"><img src="images/services.png" width="110" height="50" border="0" id="Image5" /></a></td>
<td><a href="associates.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image4','','images/associateR.png',1)"><img src="images/associate.png" width="110" height="50" border="0" id="Image4" /></a></td>
<td><a href="investors.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image3','','images/investorR.png',1)"><img src="images/investor.png" width="110" height="50" border="0" id="Image3" /></a></td>
<td><a href="contact.php" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image2','','images/contactR.png',1)"><img src="images/contact.png" width="110" height="50" border="0" id="Image2" /></a></td>
</tr>
</table></td>
</tr>
</table></td>
</tr>
<!--<tr>
<td height="6"></td>
</tr>-->
<tr>
<td background="images/bg_content.jpg" width="903px" height="477px"><table width="98%" border="0px" cellpadding="0" cellspacing="0">
<!-- <tr>
<td width="409"> </td>
<td width="476" height="26"> </td>
</tr>-->
<tr>
<td width="409" rowspan="5" valign="top"><table width="390" border="0" align="left" cellpadding="0" cellspacing="0">
<tr>
<td height="2"></td>
</tr>
<tr>
<td><img src="FinalPurpleLook/GlobalPic-AboutUS.png" alt="" width="381" height="237" /></td>
</tr>
</table> </td>
<td valign="top" class="heading">About us </td>
</tr>
<!-- <tr>
<td valign="top"> </td>
</tr>-->
<tr>
<td valign="top"class="textSimple">Lorem Epsum is an exclusive private organization engaged in a wide spectrum of global business endeavors from acquisition, development and ownership. Our core market's investments include commercial real estate, energy solutions, information technology, and health wellness.</td>
</tr>
<tr>
<td valign="top"> </td>
</tr>
<tr>
<td valign="top" class="textSimple">The philosophy of Lorem Empsum is based on honor, leadership, problem solving, project knowledge, sustainability and innovative ideas. Having powerful, influential connections, is a key element in success. With countless years of experience in several different industries we are proven to bring success with our connections and expertise knowledge.</td>
</tr>
<tr>
<!--<td> </td>
<td valign="top"> </td>
</tr>
<tr>
<td> </td>
<td valign="top"> </td>
</tr>
<tr>
<td> </td>-->
<td><p align="right" class="footer"> 9am Resource Agency LLC @ 2012 </p></td>
</tr>
</table></td>
</tr>
<tr></tr>
<tr>
<td></td>
</tr>
</table>
<script type="text/javascript"> Cufon.now(); </script>
</body>
</html>
Upvotes: 0
Views: 122
Answers (2)
Akshay Khandelwal
Reputation: 1570
There you seriously need to reconsider the Option of Starting over and if not then Please also see the Javascripts and Jqueries included which may dynamically make changes to your CSS or styling properties..
Upvotes: 1
Rick Good
Reputation: 59
A few quick comments.
First, I have no idea why you have two:
background="images/bg_content.jpg" width="903px" height="477px"
in the heading. Someone does not know what they are doing.
Second, I did note that the content adds up to 430 and yet you have your background image set at 477px, e..g, "background="images/bg_content.jpg" width="903px" height="477px" - that might be the cause.
Rick
Upvotes: 1