+- Support Forums (https://www.supportforums.net)
+-- Forum: Categories (https://www.supportforums.net/forumdisplay.php?fid=87)
+--- Forum: Webmaster Support (https://www.supportforums.net/forumdisplay.php?fid=36)
+---- Forum: Website Development (https://www.supportforums.net/forumdisplay.php?fid=43)
+---- Thread: Layout help (/showthread.php?tid=7341)
Layout help - madguitarist - 05-25-2010
Hi guys im currently making a website for my business but having trouble with the layout. I made the website in photoshop and edited it in dreamweaver. It appears fine in Safari but in firefox the layout is thrown out
.I can get the code on request if it is needed thanks....
FIREFOX
http://img687.imageshack.us/i/firefoxep.png/
SAFARI
http://img227.imageshack.us/i/safariv.png/
RE: Layout help - madguitarist - 05-25-2010
Code:
<html>
<head>
<title>wctnew</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#Site_layout {
background-color: #030202;
height: 100%;
width: 100%;
padding-top: 35px;
padding-right: 0px;
padding-bottom: 5px;
padding-left: 0px;
}
#text {
background-color: #B6A876;
height: 356px;
width: 269px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: normal;
color: #FFF;
padding: 0px;
margin: 0px;
}
-->
</style>
</head>
<body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<!-- Save for Web Slices (wctnew.psd) -->
<div id="Site_layout">
<table width="801" height="601" border="0" align="center" cellpadding="0" cellspacing="0" id="Table_01">
<tr>
<td colspan="10">
<img src="images/Logo.gif" width="330" height="84" alt=""></td>
<td colspan="4" rowspan="3">
<img src="images/Index_02.gif" width="470" height="171" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="84" alt=""></td>
</tr>
<tr>
<td colspan="10">
<img src="images/Index_03.gif" width="330" height="67" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="67" alt=""></td>
</tr>
<tr>
<td colspan="3" rowspan="2">
<img src="images/Index_04.gif" width="26" height="46" alt=""></td>
<td>
<img src="images/Home.gif" width="53" height="20" alt=""></td>
<td colspan="6">
<img src="images/Index_06.gif" width="251" height="20" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="20" alt=""></td>
</tr>
<tr>
<td colspan="6">
<img src="images/Index_07.gif" width="144" height="26" alt=""></td>
<td colspan="2" rowspan="11"><div id="text">
<p>Welccome to WCT Plastering.</p>
</div></td>
<td colspan="3" rowspan="3">
<img src="images/Index_09.gif" width="361" height="58" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="26" alt=""></td>
</tr>
<tr>
<td colspan="2" rowspan="5">
<img src="images/Index_10.gif" width="23" height="83" alt=""></td>
<td colspan="5">
<img src="images/Services.gif" width="68" height="16" alt=""></td>
<td colspan="2" rowspan="7">
<img src="images/Index_12.gif" width="79" height="138" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td colspan="5" rowspan="2">
<img src="images/Index_13.gif" width="68" height="28" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="16" alt=""></td>
</tr>
<tr>
<td rowspan="9">
<img src="images/Index_14.gif" width="36" height="371" alt=""></td>
<td rowspan="7">
<img src="images/Mainimage.jpg" width="297" height="240" alt=""></td>
<td rowspan="9">
<img src="images/Index_16.gif" width="28" height="371" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="12" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/Gallery.gif" width="65" height="18" alt=""></td>
<td rowspan="4">
<img src="images/Index_18.gif" width="3" height="94" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="18" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/Index_19.gif" width="65" height="21" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="21" alt=""></td>
</tr>
<tr>
<td rowspan="6">
<img src="images/Index_20.gif" width="18" height="320" alt=""></td>
<td colspan="4">
<img src="images/FAQS.gif" width="65" height="25" alt=""></td>
<td rowspan="2">
<img src="images/Index_22.gif" width="5" height="55" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="25" alt=""></td>
</tr>
<tr>
<td colspan="4">
<img src="images/Index_23.gif" width="65" height="30" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="30" alt=""></td>
</tr>
<tr>
<td colspan="7">
<img src="images/Contact.gif" width="97" height="15" alt=""></td>
<td rowspan="4">
<img src="images/Index_25.gif" width="55" height="265" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="15" alt=""></td>
</tr>
<tr>
<td colspan="7" rowspan="3">
<img src="images/Index_26.gif" width="97" height="250" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="119" alt=""></td>
</tr>
<tr>
<td rowspan="2">
<img src="images/Index_27.gif" width="297" height="131" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="58" alt=""></td>
</tr>
<tr>
<td colspan="2"><img src="images/Index_28.gif" width="269" height="73" alt=""></td>
<td>
<img src="images/spacer.gif" width="1" height="73" alt=""></td>
</tr>
<tr>
<td>
<img src="images/spacer.gif" width="18" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="5" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="3" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="53" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="4" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="5" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="3" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="24" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="55" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="160" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="109" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="36" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="297" height="1" alt=""></td>
<td>
<img src="images/spacer.gif" width="28" height="1" alt=""></td>
<td></td>
</tr>
</table>
</div>
<!-- End Save for Web Slices -->
</body>
</html>RE: Layout help - Natha - 05-31-2010
Yeah, to be honest why do browsers do that, some layouts, and colors are different for other browsers, and support forums is slightly different for FireFox, Internet Explorer, Opera, Flock.
RE: Layout help - Web - 07-22-2010
you should change all the table margins to auto not by doing manual,
or you can build a website much professionally with Joomla, it is really easy to use and works fine on fire fox, and Safari.