so ive made all my template design in cs6 and saved that sliced layout to web (it created a html file) not it looks good but when i zoom out with my mac on chrome the img get unaligned....? i tried too with ie8 on a pc and its all unaligned layout can someone tell me what to do to get this all sticked togheter! thanks this is the adress ; www.conceptions-sgb.com this is the html code; <html> <head> <style type="text/css"> body { background-color: #000; } </style> <center> <title>Accueil - Conceptions SGB</title> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <style type="text/css"> body { background-color: #000; } </style> <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)&&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.indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a;}} } 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[n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers.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))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];} } </script> </head> <body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" onLoad="MM_preloadImages('images/porte1.gif','images/porte2.gif','images/porte3.gif')"> <!-- Save for Web Slices (prototype1.psd) --> <table id="Tableau_01" width="1280" height="1024" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="7"> <img src="images/Accueil_01.jpg" alt="" width="1280" height="514" usemap="#Map8" border="0"></td> </tr> <tr> <td rowspan="4"> <img src="images/Accueil_02.jpg" alt="" width="555" height="510" usemap="#Map" border="0"></td> <td rowspan="3"><a href="/construction.html" target="_parent" onMouseOver="MM_swapImage('Garage mécanique','','images/porte1.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/Accueil_03.jpg" width="139" height="157" id="Garage mécanique" border="0"></a></td> <td colspan="5"> <img src="images/Accueil_04.jpg" width="586" height="8" alt=""></td> </tr> <tr> <td colspan="3"> <img src="images/Accueil_05.jpg" width="199" height="50" alt=""></td> <td rowspan="2"><a href="/construction.html" target="_parent" onMouseOver="MM_swapImage('porte3','','images/porte3.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/Accueil_06.jpg" name="GarageUsinage" width="148" height="149" id="porte3"></a></td> <td rowspan="3"> <img src="images/Accueil_07.jpg" alt="" width="239" height="502" usemap="#Map7" border="0"></td> </tr> <tr> <td rowspan="2"> <img src="images/Accueil_08.jpg" alt="" width="84" height="452" usemap="#Map4" border="0"></td> <td><a href="/construction.html" target="_parent" onMouseOver="MM_swapImage('Image13','','images/porte2.gif',1)" onMouseOut="MM_swapImgRestore()"><img src="images/Accueil_09.jpg" name="porte" width="44" height="99" id="Image13"></a></td> <td rowspan="2"> <img src="images/Accueil_10.jpg" alt="" width="71" height="452" usemap="#Map5" border="0"></td> </tr> <tr> <td> <img src="images/Accueil_11.jpg" alt="" width="139" height="353" usemap="#Map2" border="0"></td> <td> <img src="images/Accueil_12.jpg" alt="" width="44" height="353" usemap="#Map3" border="0"></td> <td> <img src="images/Accueil_13.jpg" alt="" width="148" height="353" usemap="#Map6" border="0"></td> </tr> </table> <!-- End Save for Web Slices --> <map name="Map"> <area shape="rect" coords="178,438,386,463" href="/construction.html" target="_parent"> <area shape="rect" coords="433,436,598,464" href="/construction.html" target="_parent"> </map> <map name="Map2"> <area shape="rect" coords="-17,279,73,308" href="/construction.html" target="_parent"> <area shape="rect" coords="119,279,161,306" href="/construction.html" target="_parent"> </map> <map name="Map3"> <area shape="rect" coords="-25,279,39,305" href="/construction.html" target="_parent"> </map> <map name="Map4"> <area shape="rect" coords="-1,377,112,404" href="/construction.html" target="_parent"> </map> <map name="Map5"> <area shape="rect" coords="40,379,134,407" href="/contact.html" target="_parent"> </map> <map name="Map6"> <area shape="rect" coords="-7,282,63,307" href="/contact.html" target="_parent"> </map> <map name="Map7"> <area shape="rect" coords="29,441,205,472" href="mailto:lm9racing@gmail.com" target="_parent"> </map> <map name="Map8"> <area shape="rect" coords="1167,46,1205,84" href="http://www.facebook.com/ConceptionsSgb" target="new"> </map> </body> </html></center>
Well.. I copied your code and opened it and when i resized or zoomed in-out .. nothing changed.. edit: i used firefox & chrome
This is not how a design is supposed to be sliced. If it doesn't render correctly, it's perfectly normal.