Ok, I have spent the last week trying to do this on my own. I swear I have visited EVERY Google page available.
My original problem was that my three-column layer was stacked.
After coming upon a similiar question on this site, I was able to get my footer to split into three columns with the float technique.
However, it is at an angle:
Like, column one is where I want ALL of them to be.
I will post my CSS and HTML.
I am VERY new at this, and all of you will probably puke at how bad my code is. BUT, this is why i'm coming to you. I need help, because I just can't do this alone.
You can view the website I am working on here. http://www.bbcardmore.com/
.left{
text-align:left;
float:left;
}
.right{
float:right;
text-align:right;
}
.centered{
text-align:center;
}
<?php?>
<html>
<body>
<head>
</style>
<head>
<div id="footer">
<div class="left">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><font size="5" color="red">About Us</font><br /></p></h3>
<p class="paragraph_style_1"><a title="Our History" href="http://www.bbcardmore.com/bbc-history-3/">Our History</a> <br /></p>
<p class="paragraph_style_1"><a title="Our Pastor" href="http://www.bbcardmore.com/our-pastor/">Our Pastor</a><br /> </p>
<p class="paragraph_style_1"><a title="Statement Of Faith" href="http://www.bbcardmore.com/statement-of- faith/">Statement Of Faith</a><br /></p>
<p class="paragraph_style_1"><a title="Calendar" href="http://www.bbcardmore.com/calendar/">Calendar</a><br /></p>
<p style="padding-bottom: 0pt; " class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">Map</a></p>
<div class="centered">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"><font size="5" color="red">Service Times</font><br /></p></h3>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday School~ 10:00</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday Morning Service~ 11:00 AM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday Evening Service~ 7:00 PM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Wednesday Evening Bible Study~ 7:00 PM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Transportation and child care available for all services.</a><br /></p>
<div class="right">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><a title="Contact Us" href="http://www.bbcardmore.com/contact-us/"><font size="5" color="red">Contact Us:</font><br /></p></h3>
<p class="paragraph_style_2"><a title="Map" href="http://www.bbcardmore.com/map/"><font size="3" color="red">Mailing Address:</font><br /></p>
<p class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">1515 Easley Drive<br /></p>
<p class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">Ardmore, OK 73401<br /></p>
<p class="paragraph_style_3"><span class="style"><a title="" href="mailto:bbcardmore@aol.com"><font size="3" color="red">Email:</font></span> bbcardmore@aol.com<br /></p>
<p class="paragraph_style_3"><span class="style"><a title="Contact Us" href="http://www.bbcardmore.com/contact-us/"><font size="3" color="red">Phone:</font></span> (580) 223-6629<br /></p>
<div>
</body>
</html>
I think you are looking like this demo : - http://tinkerbin.com/N87sxG5i
Actually you didn't close your child div's like : left, Center, Right so i closed the these child div's and after that i gave float:left;to your center div rather than text-align:center; to that div and its working fine now as per your requirement....
HTML
<html>
<body>
<head>
</style>
<head>
<div id="footer">
<div class="left">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><font size="5" color="red">About Us</font><br /></p></h3>
<p class="paragraph_style_1"><a title="Our History" href="http://www.bbcardmore.com/bbc-history-3/">Our History</a> <br /></p>
<p class="paragraph_style_1"><a title="Our Pastor" href="http://www.bbcardmore.com/our-pastor/">Our Pastor</a><br /> </p>
<p class="paragraph_style_1"><a title="Statement Of Faith" href="http://www.bbcardmore.com/statement-of- faith/">Statement Of Faith</a><br /></p>
<p class="paragraph_style_1"><a title="Calendar" href="http://www.bbcardmore.com/calendar/">Calendar</a><br /></p>
<p style="padding-bottom: 0pt; " class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">Map</a></p>
</div>
<div class="centered">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"><font size="5" color="red">Service Times</font><br /></p></h3>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday School~ 10:00</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday Morning Service~ 11:00 AM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Sunday Evening Service~ 7:00 PM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Wednesday Evening Bible Study~ 7:00 PM</a><br /></p>
<p class="paragraph_style_1"><a title="Service Times" href="http://www.bbcardmore.com/service-times/"> Transportation and child care available for all services.</a><br /></p>
</div>
<div class="right">
<h3><p style="padding-top: 10pt; " class="paragraph_style"><a title="Contact Us" href="http://www.bbcardmore.com/contact-us/"><font size="5" color="red">Contact Us:</font><br /></p></h3>
<p class="paragraph_style_2"><a title="Map" href="http://www.bbcardmore.com/map/"><font size="3" color="red">Mailing Address:</font><br /></p>
<p class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">1515 Easley Drive<br /></p>
<p class="paragraph_style_1"><a title="Map" href="http://www.bbcardmore.com/map/">Ardmore, OK 73401<br /></p>
<p class="paragraph_style_3"><span class="style"><a title="" href="mailto:bbcardmore@aol.com"><font size="3" color="red">Email:</font></span> bbcardmore@aol.com<br /></p>
<p class="paragraph_style_3"><span class="style"><a title="Contact Us" href="http://www.bbcardmore.com/contact-us/"><font size="3" color="red">Phone:</font></span> (580) 223-6629<br /></p>
</div>
<div>
</body>
</html>
CSS
.left{
text-align:left;
float:left;
}
.right{
float:right;
text-align:right;
}
.centered{
float:left;
margin-left:25px;
}