Logo position CSS file;
Leave left at 0 for centering, change top "em" set top position
Code: Select all
#header .div2 {
position: relative; top: 1em; left: 0;
text-align: center; /* centers the logo in its div */
}
Change top "em" set top position
Code: Select all
#header .div4 {
margin-top: 1em;
clear: both;
}
Footer position;
You have one table cell, you don't need a table for this, and you forgot a closing </tr> and </div>. You have also placed the "div1" class outside it's parent id "footer". There is no "footer" or "foot_links" in the distribution of our All CSS, maybe you have intentions of adding them, but I see no reason to. I'll provide you code below to produce the results you want without a table.
In your footer.tpl file follow below.
CHANGE THIS CODE:
Code: Select all
<div id="footer">
<div class="footer">
<table width="100%" cellpadding="3px" cellspacing="3px"><tr><td align="left" class="foot_left">
<td align="center" class="foot_links">
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=4">About Us</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=3">Privacy Policy</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=5">Terms & Conditions</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/contact">Contact Us</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/sitemap">Site Map</a></td>
</table>
</div>
<div class="div1">Powered By <a href="http://www.opencart.com">OpenCart</a><br /> Currency Collector's Corner © 2010</div>
TO THIS CODE:
Code: Select all
<div id="footer">
<div class="div1">
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=4">About Us</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=3">Privacy Policy</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/information&information_id=5">Terms & Conditions</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/contact">Contact Us</a> |
<a href="http://www.currencycollectorscorner.com/index.php?route=information/sitemap">Site Map</a>
</div>
<div class="div1">Powered By <a href="http://www.opencart.com">OpenCart</a><br /> Currency Collector's Corner © 2010</div>
</div>
In your CSS make following code changes;
CHANGE THIS CODE:
Code: Select all
#footer .div1 {
float: left;
text-align: left;
}
#footer .div2 {
float: right;
text-align: right;
}
TO THIS CODE:
Code: Select all
#footer .div1 {
margin-bottom: 1em;
/*float: left;*/
text-align: center;
}
#footer .div2 {
/*float: right;*/
text-align: center;
}
To re-order the copyright with powered by you need to modify the footer.php file in the catalog/language/english/common/ folder.
CHANGE TO CODE:
Code: Select all
$_['text_powered_by'] = 'Powered By <a href="http://www.opencart.com">OpenCart</a><br /> %s © %s';
TO THIS CODE:
Code: Select all
$_['text_powered_by'] = '%s © %s | Powered By <a href="http://www.opencart.com">OpenCart</a>';