I made my template in Photoshop and sliced it and attempted to code it in Dreamweaver. I added a simple divtag for the content box where I wanted it to be. I did so in what i thought was a successful attempt, but then I viewed the website preview in Firefox, and my website was all broken up. I then viewed it in Internet Explorer and my template was fine. Is it a problem with the slice? The css? the html? Here is the slice: The Preview in both browsers: The CSS for the content box: Code: #content { background-color: #1F1F1F; height: 492px; width: 647px; } #content { background-color: #363636; height: 492px; width: 687px; } The html: Code: <html> <head> <title>boximaps</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <link href="contentbox.css" rel="stylesheet" type="text/css"> </head> <body bgcolor="#FFFFFF" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0"> <table id="Table_01" width="1199" height="801" border="0" cellpadding="0" cellspacing="0"> <tr> <td colspan="4" rowspan="2"> [img]images/boximaps_01.jpg[/img]</td> <td colspan="7"> [img]images/boximaps_02.jpg[/img]</td> <td colspan="2" rowspan="2"> [img]images/boximaps_03.jpg[/img]</td> <td rowspan="11"> [img]images/boximaps_04.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="7"> [img]images/boximaps_05.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="5" rowspan="2">[img]images/boximaps_06.jpg[/img]</td> <td colspan="6"> [img]images/boximaps_07.jpg[/img]</td> <td colspan="2" rowspan="5"> [img]images/boximaps_08.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="6"> [img]images/boximaps_09.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="2" rowspan="3">[img]images/boximaps_10.jpg[/img]</td> <td rowspan="2"> [img]images/boximaps_11.jpg[/img]</td> <td colspan="7" rowspan="3"> [img]images/boximaps_12.jpg[/img]</td> <td> [img]images/boximaps_13.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td rowspan="2"> [img]images/boximaps_14.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td> [img]images/boximaps_15.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td rowspan="6"> [img]images/boximaps_16.jpg[/img]</td> <td colspan="6" rowspan="3"><div id="contentbox"> Welcome to Boxiom Maps!</p> I will be updating the website soon with some maps available for download. As well as tutorials, a collection of prefabs, and my upcoming WIPS and abandoned MIPS.</p> The website might have some bugs, I just threw up this quick design in Photoshop quickly and coded it in about 5 minutes, so bare with me.</p> If you would like, I will be holding a map spotlight which you can see to the right. You can email me your map, and each week I will pick the best map I have seen.</p> </p> </div></td> <td rowspan="4"> [img]images/boximaps_18.jpg[/img]</td> <td colspan="4"> [img]images/boximaps_19.jpg[/img]</td> <td rowspan="4"> [img]images/boximaps_20.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="4"> [img]images/boximaps_21.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td rowspan="2"> [img]images/boximaps_22.jpg[/img]</td> <td colspan="3"> [img]images/boximaps_23.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="6"> [img]images/boximaps_24.jpg[/img]</td> <td colspan="3"> [img]images/boximaps_25.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="5" rowspan="2"> [img]images/boximaps_26.jpg[/img]</td> <td colspan="3"> [img]images/boximaps_27.jpg[/img]</td> <td colspan="5" rowspan="2"> [img]images/boximaps_28.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td colspan="3"> [img]images/boximaps_29.jpg[/img]</td> <td> [img]images/spacer.gif[/img]</td> </tr> <tr> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td> [img]images/spacer.gif[/img]</td> <td></td> </tr> </table> </body> </html>
I remember something about firefox putting a blank line after every div, so just replace it with a <span> tag and it should be fixed, but you should also note that you may want to rewrite some of that PS generated code because it could probably make anyone trying to edit it vomit themselves. I hate those damn width and height tables. They make me dizzy.
replace all the <div></div> tags with tags (I think dreamweaver actually has a 'replace all' function)
Your css is named the same for both classes, so I didn't look through the code, but if you want the classes for 2 different things, your in a bit of trouble because its just going to overwrite by default and use the second values.
Remix that did not work, and Magicgfx I checked my CSS again i accidently copied and pasted twice: Code: #contentbox { background-color: #363636; height: 492px; width: 647px; }
