Div tags help

1

Okay…I need some assistance.

I created a header and inside of the header tag i created four additional div tags for the facebook, twitter, etc. All of the icons are positioned on the upper left hand with the float left on the css. However I want to position them on the upper right of the page, position below the margin just a tad, and for each icon separated just a little bit. How do i do that in css? Thanks. Here is link, the code for both html and css. Thanks in advanced.

http://www.preciousjewelslearning.org/



<!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=utf-8" />
<title>Precious Jewels Learning Incorporated - Home</title>
<link href="css/layout.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
-->
</style>
</head>

<body>
<div id="wrapper">
  <div id="header"><div id="followus"><div id="facebook"></div><div id="twitter"></div><div id="home"></div><div id="contact"></div></div></div>
  
  
  <div id="navigation"><img src="images/navigation/Precious-Jewels-Learning-Incorporated_03.jpg" width="817" height="47" alt="navigation" /></div>
  
  <div id="body">
  
  <div id="left"></div>
  <div id="right"></div>
  <div id="footer"></div>
  </div>
</div>
</body>
</html>





#wrapper #header #followus #facebook {
    background-image:  url(../images/header/Precious-Jewels-Learning-Incorporated%20-%20facebook.jpg);
    background-repeat: no-repeat;
    height: 57px;
    width: 56px;
    margin: 0px;
    padding: 0px;
    float: left;
}
#wrapper #header #followus #twitter {
    background-image:  url(../images/header/Precious-Jewels-Learning-Incorporated%20-%20twitter.jpg);
    height: 59px;
    width: 46px;
    margin: 0px;
    padding: 0px;
    float: left;
}
#wrapper #header #followus #home {
    background-image:  url(../images/header/Precious-Jewels-Learning-Incorporated%20-%20home.jpg);
    background-repeat: no-repeat;
    height: 59px;
    width: 42px;
    margin: 0px;
    padding: 0px;
    float: left;
}
#wrapper #header #followus #contact {
    height: 59px;
    width: 37px;
    background-image:  url(../images/header/Precious-Jewels-Learning-Incorporated%20-%20email.jpg);
    background-repeat: repeat;
    margin: 0px;
    padding: 0px;
    float: left;
}
#wrapper #header #followus {
    margin: 0px;
    padding: 0px;
}