Hi, i really need help here here is my problem, i have a two column design and i would like those to be independent (one shorter than the other. this problem occur only in IE and mozilla ,Chrome is fine
here is what the problem is
here is my code Pease help!!
Code:
<html>
<head>
<!-- TemplateBeginEditable name="doctitle" -->
<title>index</title>
<!-- TemplateEndEditable -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.sitelayout {
background-color: #FFF;
font-family: "Times New Roman", Times, serif;
color: #FFF;
background-image: url(images/background.jpg);
background-repeat: no-repeat;
background-position: center top;
}
.rightbox {
background-color: #141311;
background-image: url(images/index_24.jpg);
clear: right;
width: 501px;
color: #FFF;
}
body,td,th {
font-family: Times New Roman, Times, serif;
color: #FFF;
}
footer {
font-family: "Times New Roman", Times, serif;
color: #FFF;
padding: 20px;
}
.sitelayout #Tableau_01 tr td {
}
.sitelayout #Tableau_01 tr td .rightbox table tr th table tr td {
background-color: #141311;
}
-->
</style>
<!-- TemplateBeginEditable name="head" -->
<!-- TemplateEndEditable -->
<script src="scripts/swfobject_modified.js" type="text/javascript"></script>
<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>
<link href="Css/lftbx.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/rollover/images/accueil.gif','images/rollover/images/galerie.gif','images/rollover/images/nouveautes.gif','images/rollover/images/nos-chiots.gif')">
<!-- Save for Web Slices (index.psd) -->
<div class="sitelayout">
<table width="1009" height="709" border="0" align="center" cellpadding="0" cellspacing="0" id="Tableau_01">
<tr>
<td colspan="3" rowspan="3">
<img src="images/logo.jpg" width="438" height="132" alt=""></td>
<td colspan="4" rowspan="3"> </td>
<td colspan="6"> </td>
<td colspan="2"> </td>
<td>
<img src="images/spacer.gif" width="1" height="98" alt=""></td>
</tr>
<tr>
<td rowspan="2"><a href="index.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image50','','images/rollover/images/accueil.gif',1)"><img src="images/rollover/ongleton/images/accueil.gif" name="Image50" width="76" height="34" border="0"></a></td>
<td rowspan="5">
<img src="images/index_06.jpg" width="1" height="46" alt=""></td>
<td rowspan="2"><a href="galerie.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image51','','images/rollover/images/galerie.gif',1)"><img src="images/galerie.gif" name="Image51" width="74" height="34" border="0"></a></td>
<td rowspan="2"><a href="chiots.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image55','','images/rollover/images/nos-chiots.gif',1)"><img src="images/nos-chiots.gif" name="Image55" width="74" height="34" border="0"></a></td>
<td rowspan="2"><a href="contacts.html" onMouseOut="MM_swapImgRestore()" onMouseOver="MM_swapImage('Image53','','images/rollover/images/nouveautes.gif',1)"><img src="images/contact.gif" name="Image53" width="73" height="34" border="0"></a></td>
<td rowspan="2"><img src="images/contacts.gif" width="100" height="34"></td>
<td colspan="2">
<img src="images/menu-dr.gif" width="47" height="33" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="33" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="6">
<img src="images/index_12.jpg" width="47" height="43" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td>
<img src="images/gauche.gif" width="53" height="1" alt=""></td>
<td colspan="3">
<img src="images/index_14.jpg" width="386" height="1" alt=""></td>
<td colspan="4" rowspan="3">
<img src="images/index_15.jpg" width="200" height="12" alt=""></td>
<td colspan="4" rowspan="3">
<img src="images/index_16.jpg" width="321" height="12" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="5" style="background-image: url(images/index_17.jpg);"> </td>
<td colspan="2">
<img src="images/index_18.jpg" width="385" height="10" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="10" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="2" style="background-color: #3B3B3B;"> </td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/index_20.jpg" width="21" height="29" alt=""></td>
<td colspan="7" rowspan="2"><img src="images/titre-products.gif" width="501" height="30" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="29" alt=""></td>
</tr>
<tr>
<td rowspan="2" align="center" valign="top" bgcolor="#3B3B3B"><div class="leftbox">
<table width="375" height="333" border="0">
<tr>
<th height="33" align="center" valign="top" scope="col"><p><img src="images/index_19.jpg" width="377" height="30" alt=""></p></th>
</tr>
<tr>
<th height="195" valign="top" scope="row"><p><img src="images/text_22.jpg" width="376" height="193"></p></th>
</tr>
<tr>
<th height="24" valign="top" scope="row"> </th>
</tr>
</table>
</div></td>
<td colspan="3" rowspan="2" style="background-image: url(images/index_23.jpg);"> </td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
</tr>
<tr>
<td colspan="7" rowspan="2" valign="top" style="background-color: #141311;"><div class="rightbox">
<table width="500" border="0">
<tr>
<th colspan="3" scope="col"><table width="495" border="0">
<tr>
<th colspan="3" scope="col"> </th>
</tr>
<tr>
<th width="163" height="21" scope="row"><img src="images/titletag.jpg" width="114" height="26"></th>
<td width="153" align="center"><img src="images/titletag2.jpg" width="114" height="26"></td>
<td width="165" align="center"><img src="images/titletag (2).jpg" width="114" height="26"></td>
</tr>
<tr>
<th height="166" align="center" valign="top" scope="row"><p><img src="images/imagetag.jpg" width="114" height="126"></p>
<p>Chiots à Vendre</p></th>
<td align="center" valign="top" bgcolor="#141311"><p><img src="images/imagetag2.jpg" width="114" height="126"></p>
<p>Nos Parents</p></td>
<td align="center" valign="top"><p><img src="images/imagetag (2).jpg" width="114" height="126"></p>
<p>Nos installations</p></td>
</tr>
</table></th>
</tr>
</table>
<table width="498" border="0">
<tr>
<th height="366" scope="col"><p><img src="images/garderie.jpg" width="490" height="250"></p></th>
</tr>
</table>
<p> </p>
</div></td>
<td rowspan="2" style="background-image: url(images/index_25.jpg);"> </td>
<td rowspan="2" style="background-color: #FFF;"> </td>
<td>
<img src="images/spacer.gif" width="1" height="192" alt=""></td>
</tr>
<tr valign="top">
<td colspan="4" rowspan="3"><object id="FlashID" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="439" height="342">
<param name="movie" value="Flash/slideroyaume.swf">
<param name="quality" value="high">
<param name="wmode" value="opaque">
<param name="swfversion" value="8.0.35.0">
<!-- This param tag prompts users with Flash Player 6.0 r65 and higher to download the latest version of Flash Player. Delete it if you don’t want users to see the prompt. -->
<param name="expressinstall" value="scripts/expressInstall.swf">
<!-- Next object tag is for non-IE browsers. So hide it from IE using IECC. -->
<!--[if !IE]>-->
<object type="application/x-shockwave-flash" data="Flash/slideroyaume.swf" width="439" height="342">
<!--<![endif]-->
<param name="quality" value="high">
<param name="wmode" value="opaque">
<param name="swfversion" value="8.0.35.0">
<param name="expressinstall" value="scripts/expressInstall.swf">
<!-- The browser displays the following alternative content for users with Flash Player 6.0 and older. -->
<div>
<h4>Content on this page requires a newer version of Adobe Flash Player.</h4>
<p><a href="http://www.adobe.com/go/getflashplayer"><img src="http://www.adobe.com/images/shared/download_buttons/get_flash_player.gif" alt="Get Adobe Flash player" width="112" height="33" /></a></p>
</div>
<!--[if !IE]>-->
</object>
<!--<![endif]-->
</object></td>
<td colspan="2" valign="top" style="background-image: url(images/index_28.jpg);"> </td>
<td valign="top">
<img src="images/spacer.gif" width="1" height="81" alt=""></td>
</tr>
<tr>
<td colspan="2">
<img src="images/index_29.jpg" width="21" height="30" alt=""></td>
<td colspan="7" style="background-image: url(images/titre-accessories.jpg);"><p> </p></td>
<td colspan="2">
<img src="images/index_31.jpg" width="47" height="30" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="30" alt=""></td>
</tr>
<tr>
<td>
<img src="images/back-bottom-red.jpg" width="7" height="231" alt=""></td>
<td colspan="8" align="center" style="padding-top: 125px; padding-left: 25px; background-image: url(images/index_33.jpg);"><a href="index.html"> Accueil </a>- <a href="galerie.html">Galerie</a> - <a href="chiots.html" title="chits a vendre">Chiots à vendre</a> - <a href="prents.html" title="parents">Nos parents</a> - <a href="installation" title="nos locaux">Installation</a> - <a href="contacts.html" title="contact">Contactez-nous</a></td>
<td colspan="2">
<img src="images/droite-35.gif" width="47" height="231" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="231" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="53" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="384" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="7" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="14" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="103" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="76" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="74" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="74" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="73" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="100" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="44" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="3" height="1" alt=""></td>
<td></td>
</tr>
</table>
</div>
<!-- End Save for Web Slices -->
<script type="text/javascript">
<!--
swfobject.registerObject("FlashID");
swfobject.registerObject("FlashID");
//-->
</script>
</body>
</html>
Before you post, read our: 
