Hi Guys 'n' Gals,
I am in the process of re-creating a web site using CSS instead of
tables, but I can't get my head around positioning. Here is what I am
trying to accomplish...
+-----------------------------------------------------------------------
-----+
| +----------------------------------+
+----------------------------------+ |
| | Phone: XXXX XXXX | | Copyright
© Blah | |
| | Fax: XXXX XXXX | | Privacy
Policy | |
| +----------------------------------+
+----------------------------------+ |
+-----------------------------------------------------------------------
-----+
But i'll be stuff how to get it to work.
Here is my HTML...
<!-- Begin Footer -->
<div id="footer">
<div id="footer-contact_numbers">
<span>Phone: +61-8-9489-8700</span>
<span>Fax: +61-8-9381-8300</span>
</div>
<div id="footer-copyright">
<span>Copyright © 2005 Western Orthopaedic
Clinic</span>
<span><a href="/privacy/privacy_act.pdf">Privacy
Policy</a></span>
</div>
</div>
<!-- End Footer -->
Here is my CSS...
#footer {
width: 600px;
height: 40px;
border-top: 1px solid grey;
padding: 5px;
}
#footer span {
font-family: Verdana;
font-size: 10px;
color: black;
}
div#footer-contact_numbers {
border: 1px solid black;
position: absolute;
left: 0;
text-align: left;
}
div#footer-copyright {
border: 1px solid black;
position: absolute;
right: 0;
text-align: right;
}
But all I end up with is...
+-----------------------------------------------------------------------
-----+
+--|-------------------------------+
+-------------------------------|--+
| P|one: XXXX XXXX | |
Copyright © Bl|h |
| F|x: XXXX XXXX | |
Privacy Poli|y |
+--|-------------------------------+
+-------------------------------|--+
+-----------------------------------------------------------------------
-----+
What am I doing wrong?
Thanks
- Matt
