PDA

View Full Version : Need help with centering in Firefox


prgraphics
11-28-2007, 02:35 AM
Please excuse my ignorance. I'm new to web design and especially html code.

I have created the following in dreamweaver and it works fine in IE, but there are formating issues in firefox.

I've read the following tut but I'm not quite sure where to add the additional commands within my code: http://www.dreamweaverclub.com/css-center-content.php

my site: http://www.pinerivergraphics.com/newwebpage.html

Any help would be much appreciated.

Thanks,

Carlene

neonfluxx
11-28-2007, 04:30 AM
Thats because your code is a mess!!!!!!! You need a container to fix this. Time to learn CSS Pal.

prgraphics
11-28-2007, 05:01 AM
The code may be a mess, it's all generated out of Dreamweaver. I realize I have much to learn...this is my first stab at web design.

I have figured out how to add a wrapper that fixed most of my problems.

I now just have one more issue with FireFox. In IE the page displays correctly, but in Firefox one of my tables containing the following text is not displaying:

"Order before 12/15/07 and we'll give you a FREE annual license to your choice of either our TalentScout time-adaptive job tests or our Identity behavioral tests."

Of course I'm now having an issue with my hosting site, so below is the HTML. Any help or pointers would be great...



<!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>FADV Year End Special</title>
<style type="text/css">
<!--
body,td,th {
color: #000000;
}
body {
background-color: #FFFFFF;
text-align : center ;
min-width : 770px ;
}
div.wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 36px;
color: #000000;
}
.style2 {font-family: Arial, Helvetica, sans-serif}
.style9 {font-family: Arial, Helvetica, sans-serif; font-size: 24px; color: #000000; }
.style10 {
color: #FFFFFF;
font-size: 28px;
}
.style11 {
font-size: 20px;
color: #3d7ab8;
}
.style12 {color: #3d7ab8}
.style13 {color: #000000}
-->
</style></head>
<body>
<div class="wrapper">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th width="68%" rowspan="2" scope="col"><table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<th rowspan="8" scope="col"><img src="Web Page Header Smooth" alt="FADV header" width="1000" height="325" />
<table width="100%" border="0" cellspacing="5" cellpadding="5">
</table>
<table width="1000" border="0" cellspacing="5" cellpadding="5">
<tr>
<th height="675" class="style9" scope="col"><div align="center">Order Now through 12/31/07 to get an Annual Online Testing and Training Subscription for just $1999 and lock in next year's renewal price at just $1499!
</div>
<table width="1000" border="0" cellspacing="5" cellpadding="5">
<tr>
<th height="283" scope="col"><div align="center"><span class="style12"><span class="style13">Call</span> 800-648-3166 <span class="style13">today!</span> </span>
</div>
<table width="100%" border="0" cellspacing="5" cellpadding="5">
<tr>
<th scope="col">&nbsp;</th>
</tr>
</table>
<table width="100%" border="0" cellspacing="5" cellpadding="5">
<tr>
<th width="32%" height="228" bgcolor="3d7ab8" scope="col"><p align="center" class="style10">Order before 12/15/07 and we'll give you a FREE annual license to your choice of either our TalentScout<br />
time-adaptive job tests or our Identity behavioral tests.</p></th>
<th width="67%" scope="col"><img src="Young-Professionals-pic.gif" alt="photo" width="600" height="367" /></th>
<th width="1%" scope="col">&nbsp;</th>
</tr>
</table></th>
</tr>
</table>
<table width="100%" border="0" cellspacing="5" cellpadding="5">
<tr>
<th height="119" scope="col"><p align="center">The quality of our testing and training is unsurpassed, and at this price you can't afford to miss this opportunity. Want to take a closer look at how beautifully our testing and training solutions simulate real-world scenarios?<br />
</p>
<p align="center">Call <span class="style12">800-648-3166</span> today! </p></th>
</tr>
</table></th>
</tr>
</table></th>
<td height="19">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td height="35">&nbsp;</td>
</tr>
<tr>
<td>&nbsp;</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">&nbsp;</td>
</tr>
<tr>
<td bgcolor="#FFFFFF">&nbsp;</td>
</tr>
<tr>
<th scope="col">&nbsp;</th>
<td bgcolor="#FFFFFF">&nbsp;</td>
</tr>
</table>
<span class="style1"></span></th>
</tr>
</table>
</div>
</body>
</html>

edbr
11-28-2007, 06:31 AM
replace 3d7ab8 with on line 66 #3d7ab8

Cary
11-28-2007, 07:10 AM
Here's a simplified version of your page.

A note about this code...
<img src="Web Page Header Smooth" alt="FADV header" width="1000" height="325" />

Don't use spaces in file names. You can use underscores, and this file name is also missing the .jpg or .gif extension.

Also, th is for header cells. You should be using td instead.

<!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>FADV Year End Special</title>
<style type="text/css">
body,td,th {
color: #000000;
}
body {
background-color: #FFFFFF;
text-align : center ;
min-width : 770px ;
}
div.wrapper {
text-align : left ;
margin-left : auto ;
margin-right : auto ;
}
.style1 {
font-family: Arial, Helvetica, sans-serif;
font-size: 36px;
color: #000000;
}
.style2 {font-family: Arial, Helvetica, sans-serif}
.style9 {
color: #000000;
font: bold 24px Arial, Helvetica, sans-serif;
}
.style10 {
color: #FFFFFF;
font-size: 28px;
}
.style11 {
font-size: 20px;
color: #3d7ab8;
}
.style12 {color: #3d7ab8}
.style13 {color: #000000}
</style>
</head>
<body>
<div class="wrapper">
<table class="style9" width="1000" border="0" cellspacing="0" cellpadding="0">
<tr>
<td colspan="2"><img src="Web Page Header Smooth" alt="FADV header" width="1000" height="325" /></td>
</tr>
<tr>
<td width="1000" colspan="2">
<div align="center">Order Now through 12/31/07 to get an Annual Online Testing and Training Subscription for just $1999 and lock in next year's renewal price at just $1499! </div>
</td>
</tr>
<tr>
<td colspan="2">
<div align="center"><span class="style12"><span class="style13">Call</span> 800-648-3166 <span class="style13">today!</span> </span> </div>
</td>
</tr>
<tr>
<td colspan="2">&nbsp;</td>
</tr>
<tr>
<td width="320" bgcolor="#3d7ab8">
<p align="center" class="style10">Order before 12/15/07 and we'll give you a FREE annual license to your choice of either our TalentScout<br />time-adaptive job tests or our Identity behavioral tests.</p>
</td>
<td width="670" align="center"><img src="Young-Professionals-pic.gif" alt="photo" width="600" height="367" /></td>
</tr>
<tr>
<td colspan="2" height="119">
<p align="center">The quality of our testing and training is unsurpassed, and at this price you can't afford to miss this opportunity. Want to take a closer look at how beautifully our testing and training solutions simulate real-world scenarios?<br />
</p>
<p align="center">Call <span class="style12">800-648-3166</span> today! </p>
</td>
</tr>
</table>
</div>
</body>
</html>