I have a page but it wont center the div. Can anyone take a look at it and help. When I try to center in the body using text-align: center; it doesn't work with the main container (called Table_01). Please help! I would be ever so greatful.
The page is located here:
http://www.cpiequipment.com/test_site/index.html
Here is the code:
<html>
<!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=iso-8859-1" />
<title>Beanstalk Data</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="resources/beanstalk_interior.css" rel="stylesheet" type="text/css" />
<link href="resources/beanstalk_content.css" rel="stylesheet" type="text/css" />
<link href="resources/beanstalk_nav.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="resources/beanstalk.js"></script>
<style type="text/css">
<!--
body {
text-align:center;
}
#Table_01 {
position:absolute;
left:0px;
top:0px;
width:975px;
height:740px;
text-align:left;
margin:0 auto;
overflow: hidden;
z-index: 1;
}
#beanstalk-cover-2-01 {
position:absolute;
left:0px;
top:24px;
width:668px;
height:84px;
}
#beanstalk-cover-2-02 {
position:absolute;
left:0px;
top:0px;
width:626px;
height:23px;
background-image:url(images/beanstalk_cover_2_02.jpg);
background-repeat:repeat;
}
div.topnav {
position:absolute;
left:645px;
top:1px;
width:331px;
height:21px;
z-index:1;
}
#beanstalk-mainnav {
position:absolute;
left:0px;
top:108px;
width:667px;
height:24px;
background-image:url(images/beanstalk_cover_2_07.jpg);
background-repeat:no-repeat;
}
#beanstalk-cover-2-04 {
position:absolute;
left:626px;
top:0px;
width:349px;
height:24px;
background-image:url(images/beanstalk_cover_2_04.jpg);
background-repeat:no-repeat;
}
#beanstalk-cover-2-05 {
position:absolute;
left:448px;
top:23px;
width:38px;
height:85px;
}
#beanstalk-cover-2-06 {
position:absolute;
left:660px;
top:24px;
width:335px;
height:107px;
}
#beanstalk-cover-2-08 {
position:absolute;
left:667px;
top:108px;
width:348px;
height:56px;
}
#beanstalk-cover-2-09 {
position:absolute;
left:0px;
top:132px;
width:975px;
height:33px;
background-image:url(images/beanstalk_cover_2_09.jpg);
background-repeat:repeat;
}
#beanstalk-cover-2-10 {
position:absolute;
left:11px;
top:132px;
width:656px;
height:336px;
}
#beanstalk-cover-2-11 {
position:absolute;
left:0px;
top:164px;
width:11px;
height:546px;
background-image:url(images/beanstalk_cover_2_11.jpg);
background-repeat:no-repeat;
}
#beanstalk-cover-2-12 {
position:absolute;
left:667px;
top:164px;
width:334px;
height:576px;
}
#beanstalk-cover-2-13 {
position:absolute;
left:964px;
top:164px;
width:11px;
height:546px;
background-image:url(images/beanstalk_cover_2_13.jpg);
background-repeat:no-repeat;
z-index:1;
}
#beanstalk-cover-2-14 {
position:absolute;
left:11px;
top:468px;
width:9px;
height:272px;
}
#beanstalk-cover-2-15 {
position:absolute;
left:10px;
top:468px;
width:19px;
height:224px;
background-image:url(images/beanstalk_cover_2_15.jpg);
background-repeat:no-repeat;
}
#beanstalk-cover-2-16 {
position:absolute;
left:28px;
top:468px;
width:2px;
height:223px;
background-image:url(images/beanstalk_cover_2_16.jpg);
background-repeat:repeat;
}
#beanstalk-cover-2-17 {
position:absolute;
left:29px;
top:468px;
width:273px;
height:224px;
background-image:url(images/beanstalk_cover_2_17.jpg);
background-repeat:repeat;
}
div.leftbox_title {
position:absolute;
left:29px;
top:474px;
width:273px;
height:23px;
z-index:1;
text-align:center;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
color: #003366;
font-style: italic;
}
div.leftbox_text {
position:absolute;
left:21px;
top:515px;
width:291px;
height:165px;
z-index:2;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
font-style: italic;
}
#left_image_float {
position:absolute;
left:161px;
top:569px;
width:127px;
height:101px;
z-index:1;
}
#beanstalk-cover-2-18 {
position:absolute;
left:65px;
top:468px;
width:246px;
height:212px;
}
#beanstalk-cover-2-19 {
position:absolute;
left:301px;
top:468px;
width:34px;
height:224px;
background-image:url(images/beanstalk_cover_2_19.jpg);
background-repeat:no-repeat;
}
#middlebox1 {
position:absolute;
left:323px;
top:467px;
width:330px;
height:226px;
background-image:url(images/box_03.jpg);
background-repeat:no-repeat;
}
div.middlebox1_title {
position:absolute;
left:348px;
top:474px;
width:271px;
height:23px;
z-index:1;
text-align:center;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
color: #003366;
font-style: italic;
}
div.middlebox1_text {
position:absolute;
left:338px;
top:515px;
width:293px;
height:163px;
z-index:2;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
font-style: italic;
}
#middle_image_float {
position:absolute;
left:484px;
top:576px;
width:127px;
height:101px;
z-index:1;
}
#middlebox2 {
position:absolute;
left:641px;
top:467px;
width:330px;
height:226px;
background-image:url(images/box_03.jpg);
background-repeat:no-repeat;
}
div.middlebox2_title {
position:absolute;
left:666px;
top:474px;
width:271px;
height:23px;
z-index:1;
text-align:center;
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
color: #003366;
font-style: italic;
}
div.middlebox2_text {
position:absolute;
left:656px;
top:515px;
width:293px;
height:163px;
z-index:2;
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
font-style: italic;
}
#right_image_float {
position:absolute;
left:821px;
top:577px;
width:127px;
height:101px;
z-index:1;
}
#beanstalk-cover-2-20 {
position:absolute;
left:7px;
top:165px;
width:253px;
height:545px;
background-image:url(images/beanstalk.jpg);
background-repeat:no-repeat;
}
#beanstalk-cover-2-21 {
position:absolute;
left:20px;
top:696px;
width:18px;
height:14px;
}
#beanstalk-cover-2-22 {
position:absolute;
left:0px;
top:710px;
width:975px;
height:30px;
background-image:url(images/beanstalk_cover_2_22.jpg);
background-repeat:repeat;
}
#beanstalk-cover-2-23 {
position:absolute;
left:20px;
top:710px;
width:1px;
height:30px;
}
#beanstalk-cover-2-24 {
position:absolute;
left:21px;
top:710px;
width:50px;
height:30px;
}
#beanstalk-cover-2-25 {
position:absolute;
left:271px;
top:166px;
width:519px;
height:288px;
}
#beanstalk-cover-2-26 {
position:absolute;
left:975px;
top:710px;
width:14px;
height:30px;
}
.style4 {
font-size: 18px;
font-family: Arial, Helvetica, sans-serif;
color: #003366;
font-style: italic;
}
.style5 {font-size: 36px; color: #003366; font-family: Arial, Helvetica, sans-serif;}
.style6 {
font-size: 12px;
font-family: Arial, Helvetica, sans-serif;
}
.style13 {font-size: 36px; color: #003366; font-family: Arial, Helvetica, sans-serif; font-weight: bold; }
-->
</style>
</head>
<body>
<div id="Table_01">
<div id="beanstalk-cover-2-01"><img src="images/Logo.jpg" alt="Beanstalk Data" width="365" height="70"></div>
<div class="topnav"><a href="index.htm" class="topNavLink">HOME</a>|<a href="index.htm" class="topNavLink">CONTACT US</a>|<a href="index.htm" class="topNavLink">REQUEST DEMO</a>|<a href="index.htm" class="topNavLink"> SITE MAP </a> </div>
<div id="beanstalk-cover-2-02"></div>
<div id="beanstalk-cover-2-04"></div>
<div id="beanstalk-cover-2-06">
<p> </p>
<blockquote>
<p class="style4"><strong>Call Now:</strong><br />
<span class="style13">(704) 529-5044</span></p>
</blockquote>
</div>
<div id="beanstalk-mainnav"></div>
<div id="mainNav">
<div id="navholder">
<ul id="nav">
<li ><a href="#" ><br />
<span class="moveover"> About Beanstalk Data</span></a>
<li><a href="#"><br /><span class="moveover"> Beanstalk Data Tools</span></a>
<ul>
<li><a href="#"> Contact Management</a></li>
<li><a href="#"> Direct Mail</a></li>
<li><a href="#"> Email Marketing</a></li>
<li><a href="#"> Personalized URL's</a></li>
<li><a href="#"> Tracking</a></li>
<li><a href="#"> Scheduling</a></li>
</ul>
</li>
<li ><a href="#" ><br /><span class="moveover"> How Beanstalk Works</span></a>
</li>
<li ><a href="#" ><br /><span class="moveover"> &nb sp; How To Get Started</span></a>
</li>
</ul>
<!--End Nav Holder --> </div></div>
<div id="beanstalk-cover-2-09"></div>
<div id="beanstalk-cover-2-11"></div>
<div id="beanstalk-cover-2-13"></div>
<div id="beanstalk-cover-2-20"></div>
<div id="beanstalk-cover-2-15"></div>
<div id="beanstalk-cover-2-16"></div>
<div class="leftbox_title">How Beanstalk Can Help. </div>
<div class="leftbox_text">
<p>Isn’t it nice when something important happens in your business and you don’t have to be involved with every step of the process? Beanstalk gets you there.</p>
<p><br />
<br />
<br />
Click here to read more...</p>
</div>
<div id="left_image_float"><img src="images/hand_small.jpg" alt="Hand" /></div>
<div id="beanstalk-cover-2-17"></div>
<div id="beanstalk-cover-2-19"></div>
<div class="middlebox1_title">Tools for Success! </div>
<div class="middlebox1_text">
<p>Contact Management, Direct Mail, Personalized URL’s, Email Marketing, and much more! Beanstalk provides you the tools you need to run a successful marketing campaign.</p>
<p><br />
<br />
Click here to read more... </p>
</div>
<div id="middle_image_float"> <img src="images/tools.jpg" alt="Beanstalk Tools" width="144" height="99" /></div>
<div id="middlebox1"></div>
<div class="middlebox2_title">Request A Demonstration. </div>
<div class="middlebox2_text">
<p>Don't waste another minute! Fill out our online request and one of our experienced representatives will contact you to setup a FREE Demonstration. Let us shoe you how beanstalk can help YOUR business. </p>
<p><br />
<br />
Click here for your FREE Demo...</p>
</div>
<div id="right_image_float"><img src="images/laptop.jpg" alt="request demonstration" width="120" height="99" /></div>
<div id="middlebox2"></div>
<div id="beanstalk-cover-2-22"></div>
<div id="beanstalk-cover-2-25">
<table width="516" height="272" border="0">
<tr>
<td height="45" colspan="3" valign="top" class="style5">Marketing Automation...</td>
</tr>
<tr>
<td height="28" colspan="3" valign="top"><div align="right" class="style4">What is it and why should you care. </div></td>
</tr>
<tr>
<td colspan="3" valign="top"><p class="style6">A revolution is afoot! The complexity of today’s marketing and the increase of marketing clutter has created a demand for innovative new tools to amplify the value of your marketing budget. It’s not enough that these tools work - they must take advantage of today’s technology for maintaining data to eliminate waste and deliver relevant messages to the proper audience.</p>
<p class="style6">Beanstalk Data is the blending marketing soluions combined with process improvement to increase marketing effectiveness. Beanstalk Data will actually decrease your marketing budget by eliminating costly manual transactions and at the same time increase your return on marketing investment.</p></td>
</tr>
</table>
</div>
</div>
</body>
</html>