PDA

View Full Version : Page created in Fireworks won't center


misstheresa2009
02-02-2010, 08:05 PM
Hi everyone!

I just created this website in Fireworks and imported into Dreamweaver. Everything looks fine but the page won't center in the browser. I tried everything. Can someone help me?

Here is the code for the container:

#FWTableContainer248742272 {
/* The master div to make sure that our popup menus get aligned correctly. Be careful when playing with this one. */
position:absolute;
width:848px;
height:952px;
text-align:center;
padding-top: 35px;
padding-right: 0px;
padding-left: 0px;
background-position: center center;
margin-top: 0px;
margin-right: 5px;
margin-bottom: 0px;
margin-left: 5px;
}

I'd appreciate any help anyone can give me.

Corrosive
02-02-2010, 08:34 PM
Take out the position absolute and then give it left and right margins set to auto. That should do it.

misstheresa2009
02-02-2010, 08:43 PM
It worked! You are a genius. Thanks!

Corrosive
02-02-2010, 08:45 PM
You are welcome :)

DavidMorris123193
01-31-2011, 03:47 PM
I need help i have been all over the place trying to get this to work. My website still wont center. This is a project for my ADV web design class and im the only one who made their website in fireworks just because it looks better, but it wont center. Ill attach my html and css code, please help me.

HTML CODE

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Home</title>
<link rel="stylesheet" type="text/css" href="./Home.css" media="all" />
<!--[if IE]>
<style type="text/css" media="all">.borderitem {border-style: solid;}</style>
<![endif]-->
<style type="text/css">
#apDiv1 {
position:absolute;
left:85px;
top:251px;
width:561px;
height:753px;
z-index:1;
}
</style>
</head>

<body>
<div class="Txt_InternationalPizza">

<p class="lastNode">International<br />Pizza Parlor
</p>
</div>
<div id="Div2">
</div>
<div class="Txt_Newsletter">

<p class="lastNode">Newsletter, contains deals and coupons
</p>
</div>
<img src="Images/Home_r2_c2.gif" id="Home_r2_c2" alt="" />
<img src="Images/Home_r3_c11.gif" id="Home_r3_c11" alt="" />
<img src="Images/Home_r3_c13.gif" id="Home_r3_c13" alt="" />
<img src="Images/Home_r3_c15.gif" id="Home_r3_c15" alt="" />
<img src="Images/Home_r3_c17.gif" id="Home_r3_c17" alt="" />
<img src="Images/Home_r5_c5.gif" id="Home_r5_c5" alt="" />
<img src="Images/Home_r5_c7.gif" id="Home_r5_c7" alt="" />
<img src="Images/Home_r5_c8.gif" id="Home_r5_c8" alt="" />
<img src="Images/Home_r5_c10.gif" id="Home_r5_c10" alt="" /><img src="Images/Home_r8_c2.gif" id="Home_r8_c2" alt="" /><img src="Images/Home_r8_c9.gif" id="Home_r8_c9" alt="" />
<img src="Images/Home_r10_c9.gif" id="Home_r10_c9" alt="" />
<img src="Images/Home_r12_c9.gif" id="Home_r12_c9" alt="" />
<img src="Images/Home_r14_c9.gif" id="Home_r14_c9" alt="" />
<img src="Images/Home_r15_c2.gif" id="Home_r15_c2" alt="" />
<img src="Images/Home_r15_c3.gif" id="Home_r15_c3" alt="" />
<img src="Images/Home_r15_c6.gif" id="Home_r15_c6" alt="" />
<img src="Images/Home_r16_c3.gif" id="Home_r16_c3" alt="" />
<img src="Images/Home_r18_c2.gif" id="Home_r18_c2" alt="" />
<div id="apDiv1"><img src="Images/HomePageImagesAlt.gif" width="561" height="703" /></div>
</body>
</html>

CSS CODE

@charset "utf-8";

body {
background-color: #fff;
background-attachment: scroll;
background-image: url(Images/BG.png);
background-repeat: no-repeat;
font-size: 62.5%;
width:1000px;
height:1200px;
text-align:center;
padding-top: 35px;
padding-right: 0px;
padding-left: 0px;
margin-top: 0px;
margin-right: 0px auto;
margin-bottom: 0px;
margin-left: 0px auto;
}
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%;
}
#Div {
left: 77px;
position: absolute;
top: 84px;
margin-bottom: 0;
background-color: #fff;
width: 15px;
padding-top: 3px;
height: 5px;
height: 6px;
overflow: hidden;
}
.Txt_InternationalPizza {
font-family: Times New Roman, Times, serif;
font-size: 270%;
font-style: italic;
font-weight: bold;
text-align: left;
color: #fff;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
left: 267px;
position: absolute;
top: 86px;
margin-bottom: 0;
}
#Div2 {
left: 455px;
position: absolute;
top: 97px;
margin-bottom: 0;
background-color: #9fd4ff;
border: 1px solid #666;
width: 508px;
padding-top: 0px;
height: 45px;
}
html > body #Div2 {
height: auto;
min-height: 44px;
}
.Txt_Newsletter {
font-family: Times New Roman, Times, serif;
font-size: 270%;
font-style: italic;
font-weight: bold;
text-align: left;
color: #fff;
line-height: 120%;
padding-bottom: 2px;
padding-top: 1px;
left: 139px;
position: absolute;
top: 1014px;
margin-bottom: 0;
}
#Home_r2_c2 {
left: 78px;
position: absolute;
top: 18px;
height: 149px;
margin-bottom: 0;
width: 166px;
}
#Home_r3_c11 {
left: 801px;
position: absolute;
top: 50px;
height: 24px;
margin-bottom: 0;
width: 24px;
}
#Home_r3_c13 {
left: 843px;
position: absolute;
top: 50px;
height: 24px;
margin-bottom: 0;
width: 24px;
}
#Home_r3_c15 {
left: 885px;
position: absolute;
top: 50px;
height: 24px;
margin-bottom: 0;
width: 24px;
}
#Home_r3_c17 {
left: 927px;
position: absolute;
top: 50px;
height: 24px;
margin-bottom: 0;
width: 24px;
}
#Home_r5_c5 {
left: 455px;
position: absolute;
top: 97px;
height: 46px;
margin-bottom: 0;
width: 98px;
}
#Home_r5_c7 {
left: 553px;
position: absolute;
top: 97px;
height: 46px;
margin-bottom: 0;
width: 105px;
}
#Home_r5_c8 {
left: 658px;
position: absolute;
top: 97px;
height: 46px;
margin-bottom: 0;
width: 135px;
}
#Home_r5_c10 {
left: 793px;
position: absolute;
top: 97px;
height: 46px;
margin-bottom: 0;
width: 172px;
}
#Home_r8_c2 {
left: 77px;
position: absolute;
top: 179px;
height: 867px;
margin-bottom: 0;
width: 581px;
}
#Home_r8_c9 {
left: 725px;
position: absolute;
top: 179px;
height: 210px;
margin-bottom: 0;
width: 240px;
}
#Home_r10_c9 {
left: 725px;
position: absolute;
top: 414px;
height: 210px;
margin-bottom: 0;
width: 240px;
}
#Home_r12_c9 {
left: 725px;
position: absolute;
top: 652px;
height: 210px;
margin-bottom: 0;
width: 240px;
}
#Home_r14_c9 {
left: 725px;
position: absolute;
top: 893px;
height: 210px;
margin-bottom: 0;
width: 240px;
}
#Home_r15_c2 {
left: 77px;
position: absolute;
top: 1046px;
height: 57px;
margin-bottom: 0;
width: 167px;
}
#Home_r15_c3 {
left: 244px;
position: absolute;
top: 1046px;
height: 40px;
margin-bottom: 0;
width: 220px;
}
#Home_r15_c6 {
left: 464px;
position: absolute;
top: 1046px;
height: 57px;
margin-bottom: 0;
width: 194px;
}
#Home_r16_c3 {
left: 244px;
position: absolute;
top: 1086px;
height: 17px;
margin-bottom: 0;
width: 220px;
}
#Home_r18_c2 {
left: 77px;
position: absolute;
top: 1148px;
height: 44px;
margin-bottom: 0;
width: 887px;
}


Im new to using fireworks and websites, so when you help please be very specific.

domedia
01-31-2011, 04:20 PM
This has already been answered in this thread.

If in doubt, you can also check our tutorial:
http://www.dreamweaverclub.com/css-center-content.php