Very frustrated - spent days - fireworks layout looks pooh in dreamweaver ! HELP

Question

Hi
I hope someone can help as I originally made a basic web page in dreamweaver using a very good site that did it step by step.  Encouraged I bought Web Premium CS4 and Photoshop elements.  Then I came across Fireworks in the package and after looking on the web was excite that I could make an even better site.
Now I am just sooooo frustrated.  I have made a great looking site for a friend, that when previewed in Fireworks looks brilliant.  I exported to Dreamweaver so that I can add some links and other pages, but prior ti this I thought I would look what it looks like in the browser once again.
It looks awful!  My header image has been duplicated across the top, the  olours looks different and the gradient I put in the side columns isn't there at all.  The nav bar bits are a look naff.  I thought that this package was mean't to help us non techhies !  PLEASE HELP !
Thanks
Julie

Answer 1

Hi Runrunforest.
wow ! That's so kind of you.  I will have a go at uploading it now.  I did try to attach the file yesterday for Linda, but the 'image' function kept crashing.. I'm using a macbook of my daughter's so that may be the problem with the uploading?  Will have a go.
Also can anyone suggest a good step by step way to learn the packages?  I did see that the range of 'Missing Manuals' have a god write up.
Thanks again, so much appreciated !
This is the css file created by Fireworks
Is that what you need?
@charset "utf-8";
body {
background-color: #fff;
font-size: 62.5%;
margin: 0;
padding: 0;
body * {
font-size: 100%;
h1, h2, h3, h4, h5, h6 {
font-weight: normal;
p {
margin-bottom: 1.1em;
margin-top: 0;
#main p.lastNode {
margin-bottom: 0;
a:link img, a:visited img {
border: none;
div.clearFloat {
clear: both;
font-size: 0;
height: 0;
line-height: 0px;
li.clearFloat {
clear: both;
ul.symbolList {
display: inline;
float: left;
list-style-type: none;
margin: 0;
padding: 0;
.AbsWrap {
position: relative;
width: 100%;
.rowWrap {
width: 100%;
#main {
margin: 0 auto;
width: 960px;
#header {
margin-left: 12px;
margin-top: 1px;
display: inline;
float: left;
margin-bottom: 0;
background-color: #fff;
background-attachment: scroll;
background-image: url(images/bg_header.png);
background-position: left top;
background-repeat: repeat-x;
width: 940px;
padding-top: 0px;
height: 100px;
html > body #header {
height: auto;
min-height: 100px;
#bg_header_top {
margin-left: 0px;
margin-top: 0px;
background-image: url(images/bg_header_top.gif);
overflow: hidden;
display: inline;
float: left;
height: 9px;
margin-bottom: 0;
width: 938px;
#colwrap2 {
float: left;
margin-left: 0px;
margin-top: 0px;
width: 561px;
#ukipbath_r3_c2 {
margin-left: 0px;
margin-top: 0px;
background-image: url(images/ukipbath_r3_c2.gif);
overflow: hidden;
display: inline;
float: left;
height: 1px;
margin-bottom: 0;
width: 562px;
#logo {
margin-left: 12px;
margin-top: 4px;
display: inline;
float: left;
height: 79px;
margin-bottom: 0;
width: 506px;
#ukipbath_r3_c9 {
margin-left: 0px;
margin-top: 0px;
display: inline;
float: left;
height: 91px;
margin-bottom: 0;
width: 369px;
#ukipbath_r3_c12 {
margin-left: 0px;
margin-top: 0px;
background-image: url(images/ukipbath_r3_c12.gif);
overflow: hidden;
display: inline;
float: left;
height: 1px;
margin-bottom: 0;
width: 7px;
#nav_top {
margin-left: 10px;
margin-top: 4px;
display: inline;
float: left;
margin-bottom: 0;
background-color: #7e276e;
width: 940px;
padding-top: 0px;
height: 39px;
html > body #nav_top {
height: auto;
min-height: 40px;
#Home {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 70px;
margin-top: 11px;
display: inline;
float: left;
margin-bottom: 0;
#Home :link, #Home :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Home :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Home :hover, #Home :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Home :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Bath_Enterprise_Trust {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 61px;
margin-top: 10px;
display: inline;
float: left;
margin-bottom: 0;
#Bath_Enterprise_Trust :link, #Bath_Enterprise_Trust :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Bath_Enterprise_Trust :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Bath_Enterprise_Trust :hover, #Bath_Enterprise_Trust :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Bath_Enterprise_Trust :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#The_Team {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 49px;
margin-top: 11px;
display: inline;
float: left;
margin-bottom: 0;
#The_Team :link, #The_Team :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#The_Team :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#The_Team :hover, #The_Team :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#The_Team :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#News {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 55px;
margin-top: 11px;
display: inline;
float: left;
margin-bottom: 0;
#News :link, #News :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#News :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#News :hover, #News :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#News :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Contact {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 47px;
margin-top: 11px;
display: inline;
float: left;
margin-bottom: 0;
#Contact :link, #Contact :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Contact :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Contact :hover, #Contact :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Contact :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Links {
color: #fff;
font-weight: bold;
font-family: Tahoma, Geneva, sans-serif;
font-size: 140%;
margin-left: 70px;
margin-top: 11px;
display: inline;
float: left;
margin-bottom: 0;
#Links :link, #Links :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Links :visited {
color: #fff;
font-weight: bold;
text-decoration: none;
#Links :hover, #Links :focus {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#Links :active {
color: #ececec;
font-weight: bold;
text-decoration: underline;
#content_wrapper {
margin-left: 10px;
margin-top: 5px;
display: inline;
float: left;
margin-bottom: 0;
width: 940px;
padding-top: 0px;
height: 1399px;
html > body #content_wrapper {
height: auto;
min-height: 1400px;
#colwrap3 {
float: left;
margin-left: 0px;
margin-top: 0px;
width: 219px;
#bg_nav_col {
margin-left: 0px;
margin-top: 12px;
display: inline;
float: left;
margin-bottom: 0;
background-color: #7e276e;
background-attachment: scroll;
background-image: url(images/bg_side_nav_middle.gif);
background-position: center center;
background-repeat: repeat-y;
width: 220px;
padding-top: 0px;
height: 1275px;
html > body #bg_nav_col {
height: auto;
min-height: 1275px;
#bg_side_nav_top {
margin-left: 14px;
margin-top: 0px;
background-image: url(images/bg_side_nav_top.gif);
overflow: hidden;
display: inline;
float: left;
height: 8px;
margin-bottom: 0;
width: 190px;
.h4_heading {
font-family: 'Handwriting, Dakota', Arial, Helvetica, sans-serif;
font-size: 200%;
font-weight: bold;
text-align: center;
color: #000;
line-height: 155%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 8px;
margin-top: 12px;
display: inline;
float: left;
margin-bottom: 0;
width: 197px;
#bg_side_nav_bottom {
margin-left: 14px;
margin-top: 90px;
background-image: url(images/bg_side_nav_bottom.gif);
overflow: hidden;
display: inline;
float: left;
height: 8px;
margin-bottom: 0;
width: 5px;
#ukipbath_r13_c5 {
margin-left: 10px;
margin-top: 46px;
display: inline;
float: left;
height: 220px;
margin-bottom: 0;
width: 175px;
.Txt_Has {
font-family: 'Handwriting, Dakota', Arial, Helvetica, sans-serif;
font-size: 180%;
font-weight: bold;
text-align: center;
color: #7e266c;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 24px;
margin-top: 9px;
display: inline;
float: left;
margin-bottom: 0;
width: 174px;
.Txt_Loyal {
font-family: 'Handwriting, Dakota', Arial, Helvetica, sans-serif;
font-size: 180%;
font-weight: bold;
text-align: center;
color: #7e266c;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 21px;
margin-top: 17px;
display: inline;
float: left;
margin-bottom: 0;
width: 179px;
.Txt_Is {
font-family: 'Handwriting, Dakota', Arial, Helvetica, sans-serif;
font-size: 180%;
font-weight: bold;
text-align: center;
color: #7e266c;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 24px;
margin-top: 21px;
display: inline;
float: left;
margin-bottom: 0;
width: 174px;
#colwrap4 {
float: left;
margin-left: 0px;
margin-top: 0px;
width: 500px;
#content_img_2 {
margin-left: 20px;
margin-top: 13px;
display: inline;
float: left;
height: 163px;
margin-bottom: 0;
width: 461px;
#content_img_1 {
margin-left: 27px;
margin-top: 47px;
display: inline;
float: left;
height: 116px;
margin-bottom: 0;
width: 449px;
.h1_heading {
font-family: Arial, Helvetica, sans-serif;
font-size: 180%;
text-align: center;
color: #000;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 21px;
margin-top: 14px;
display: inline;
float: left;
margin-bottom: 0;
width: 461px;
.main_content {
font-family: Arial, Helvetica, sans-serif;
font-size: 160%;
text-align: left;
color: #000;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 3px;
margin-top: 7px;
display: inline;
float: left;
margin-bottom: 0;
width: 497px;
#colwrap5 {
float: left;
margin-left: 0px;
margin-top: 0px;
width: 220px;
#bg_sub_col_top {
margin-left: 0px;
margin-top: 12px;
background-image: url(images/bg_sub_col_top.gif);
overflow: hidden;
display: inline;
float: left;
height: 8px;
margin-bottom: 0;
width: 220px;
#footer {
margin-left: 0px;
margin-top: 24px;
display: inline;
float: left;
margin-bottom: 0;
background-color: #7e276e;
width: 940px;
padding-top: 0px;
height: 39px;
html > body #footer {
height: auto;
min-height: 40px;
.Txt_Copyright {
font-family: 'Comic Sans MS', Arial, Helvetica, sans-serif;
font-size: 140%;
font-weight: bold;
text-align: center;
color: #000;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
margin-left: 17px;
margin-top: 12px;
display: inline;
float: left;
margin-bottom: 0;
width: 904px;