I'm not sure what you mean. Apart from the mangled code that I posted (must have gor corrupted somehow) the posisiong of the links is in exactly the same pplace as your example.
Code:
<!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>
<script language="JavaScript" type="text/javascript" src="<A href="<A href="http://www.ericberg.net/js.js"></script">http://www.ericberg.net/js.js"></script">http://www.ericberg.net/js.js"></script">http://www.ericberg.net/js.js"></script>
<link href="s.css" rel="stylesheet" type="text/css" />
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="Content-Language" content="en-us" />
<meta name="ROBOTS" content="ALL" />
<meta name="keywords" content="web design, css, xhtml, web standards, usability, accessibility, cross-browser, foward-compatible" />
<title>eric berg: web design that doesn't discriminate</title>
<style type="text/css">
/* CSS Document */
body {
background: #9cf;
font: small/1.4 "Lucida Grande", "Trebuchet MS", "Bitstream Vera Sans", Verdana, Helvetica, sans-serif;
text-align: center;
color: #393;
letter-spacing: 1px;
margin: 0;
padding: 0;
border: 0;
}
#box {
width: 640px;
margin: 0 auto;
padding: 10px 0 0 0;
text-align: left;
position:relative;
}
html>#box {
width: 640px;
}
#head {
background: url(http://www.ericberg.net/i/hed.gif) no-repeat center top;
margin: 0;
padding: 6px 0 0 0;
}
#head h1 {
background: url(http://www.ericberg.net/i/lg3.gif) no-repeat 25px 0;
margin: 10px 0 0 0;
padding: 0 ;
height: 53px;
text-align:left;
cursor: hand;
}
.hide {
display: none;
}
/*#head h1:hover {
background: url(http://www.ericberg.net/i/lg3o.gif) no-repeat left top;
}*/
#nav {
float: right;
display: block;
margin: 0;
padding: 23px 40px 0 0;
width: auto;
text-align: center;
}
html>#nav {
}
#nav ul {
text-align: center;
background: transparent url(http://www.ericberg.net/i/nv1.gif);
margin: 0;
display: block;
padding: 19px 0 0 2px;
list-style-type: none;
line-height: 2em;
letter-spacing: 2px;
border: 0;
height: 131px;
width: 119px;
voice-family: "\"}\"";
voice-family: inherit;
width: 117px;
}
#nav ul li {
margin: 0;
padding: 0;
display: block;
}
#nav ul li a {
margin: 0;
padding: 0;
text-decoration: none;
text-align: center;
color: #900;
height: 26px;
display: block;
border: 0;
}
#nav ul li a:hover {
background: url(http://www.ericberg.net/i/hv2.gif) no-repeat 50% 0;
}
#nav .active {
background: url(http://www.ericberg.net/i/hv2.gif) no-repeat 50% 0;
}
#main {
background: url(http://www.ericberg.net/i/mid.gif) center top repeat-y;
margin: 0;
padding: 25px 0 0 30px;
min-height: 260px;
}
#main ul {
margin: 0;
padding: 0 0 0 10px;
list-style-type: none;
font-size: .9em;
}
#main ul li {
margin: 0;
padding: 2px 0 0 0;
}
#main ul li .active {
border-bottom: 1px dashed #990000}
#content {
text-align: left;
width: 420px;
padding: 0;
margin: 0 0 0 0;
border: 1px dashed #00CC66;
background-color: #F7F7F7;
}
#content p {
text-indent: 20px;
margin: 0;
padding: 10px;
}
#foot {
background: transparent url(http://www.ericberg.net/i/botsi.gif) no-repeat center top;
margin: 0px 0 0 0;
padding: 0;
height: 225px;
vertical-align: bottom;
display: block;
}
#foot p {
text-align: left;
margin: 0;
padding: 196px 0 0 25px;
color: #FFF;
font-size: 10px;
}
a {
color: #990000;
text-decoration: none;
}
a:hover {
border-bottom: 1px dashed #990033;
}
h4 {
margin: 0px;
padding: 15px 0px 5px 10px;
}
#links {
padding: 10px 0;
position:absolute;
top:250px;
right:45px;
width:110px;
}
#links ul {
font-size: 10px;
margin: 0px;
padding: 2px 14px 3px 14px;
display: block;
text-align: center;
list-style-type: none;
border: 1px dashed #00CC66;
}
</style>
</head>
<body onload="MM_preloadImages('i/lg3o.gif')">
<div id="box">
<div id="head">
<h1><span class="hide">eric berg: web design that doesn't discriminate</span></h1>
</div>
<div id="nav">
<ul>
<li><a href="default.htm">home</a></li>
<li><a href="about.htm" class="active">about</a></li>
<li><a href="work.htm">work</a></li>
<li><a href="contact.htm">contact</a></li>
</ul>
</div>
<div id="links">
<ul>
<li>Friendly Sites:</li>
<li><a href="<A href="http://www.spreadfirefox.com/?q=affiliates&id=0&t=84"><img">http://www.spreadfirefox.com/?q=affiliates&id=0&t=84"><img src="http://www.spreadfirefox.com/commun...0x15/blue_2.gif" alt="Get Firefox!" width="80" height="15" border="0" title="Get Firefox!"/></a></li>
<li><a href="http://browsehappy.com/" title="Browse Happy: Switch to a safer browser today"><img border="0" img src="http://www.ericberg.net/i/bh_80x15.gif" alt="Browse Happy logo" width="80" height="15" /></a></li>
<li><a href="<A href="http://www.alistapart.com/"><img">http://www.alistapart.com/"><img src="http://www.ericberg.net/i/ala.gif" border="0" /></a></li>
<li><a href="<A href="http://www.zeldman.com/"><img">http://www.zeldman.com/"><img src="http://www.ericberg.net/i/zeld.gif" border="0" /></a></li>
<li><a href="<A href="http://www.godaddy.com/"><img">http://www.godaddy.com/"><img src="http://www.ericberg.net/i/gdad.gif" border="0" /></a></li>
<li>Validate Me:</li>
<li><a href="<A href="http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ericberg.net%2F"><img">http://validator.w3.org/check?uri=http%3A%2F%2Fwww.ericberg.net%2F"><img src="http://www.ericberg.net/i/xhtmlv.gif" width="80" height="15" border="0" /></a></li>
<li><a href="<A href="http://jigsaw.w3.org/css-validator/validator?uri=http://www.ericberg.net/s.css"><img">http://jigsaw.w3.org/css-validator/validator?uri=http://www.ericberg.net/s.css"><img src="http://www.ericberg.net/i/cssv.gif" width="80" height="15" border="0" /></a></li>
<li><a href="<A href="http://bobby.watchfire.com/bobby/bobbyServlet?URL=http%3A%2F%2Fwww.ericberg.net&output=Submit&gl=wcag1-aaa&test="><img">http://bobby.watchfire.com/bobby/bobbyServlet?URL=http%3A%2F%2Fwww.ericberg.net&output=Submit&gl=wcag1-aaa&test="><img src="http://www.ericberg.net/i/bob.gif" border="0" /></a></li>
</ul>
</div>
<div id="main">
<div id="content">
<p align="left"> Lorem ipsum dolor sit amet, consectetuer adipiscing elit,
sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam
erat volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
<p align="left">Duis autem vel eum iriure dolor in hendrerit in vulputate
velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis
at vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
</div>
<div id="foot">
<p>©2004 Eric Berg</p>
</div>
</div>
</body>
</html>
You#ll have to recode the links html as it got mangeld but if you cut and pste it will show the layout ok.
I'm a little unclear on the difference between relative and absolute positioning; i thought absolute was supposed to position them in relation to their container element? thanks
Theres a good explanation in the FAQ about the different positioning systems and it would do good for you to read it to get a good understanding 
Absolute elements are placed in relation to their parent. the parent is any ancestor that has a position:relative or position absolute defined otherwise the parent is the html element.
Relative positioning moves an element in relation to itself and is not usually used for structural layout but for small effects. When an element is removed by relative positioning the space it previously occupied is preserved and all elements think its still where it was. This can leave big holes around the page when you use relative positioning for main structures.
Paul
floating 2 divs on top of each other IE problem
Originally Posted by Paul O'B
I've no idea how that crept in there - someone must have come up to my keyboard and typed it in when I wasn't looking.
Bookmarks