Can't move elements in css divs - html

Question

For some reason I have a parent div called banner which contains a number of child divs, however in my css styles sheet I can't seem to move any elements especially the "CRAFT412" logo image to my desired position within the banner. I've tried using left/right/top/bottom to move these elements but nothing seems to budge them. If anyone could help me here I'd appreciative it.
Here is my HTML for a page on my site
<!--TOP BANNER SECTION-->
<div id="banner">
<div id="logo">
<img src="images/CRAFT412 - Logo.png" width="500" height="281" alt="CRAFT412">
</div>
<div id="ip_box"></div>
<div id="ip_text">
<p>SERVER IP<P/>
<p>craft412.serveminecraft.net<P/>
</div>
<div id="teamspeak_box"></div>
<div id="teamspeak_box_2"></div>
<div id="teamspeak_text">
<p>TEAMSPEAK<P/>
</div>
<div id="teamspeak_image">
<a href="ts3server://craft412.serveminecraft.net:9987">
<img src="images/CRAFT412 - Box - Teamspeak.png" alt="TEAMSPEAK">
</a>
</div>
</div>
Also here is my CSS for the same divs
/*CSS FOR ALL PAGES*/
/*BODY/WRAPPER SECTION*/
body {
background:#EEEEEE;
background-repeat: no-repeat;
background-attachment: fixed;
}
#wrapper {
width: 1750px;
margin: 0 auto;
background-color: white;
border-radius: 5px;
box-shadow: 0px 1.5px 2px 0px;
border: 1.5px solid #E0E0E0;
color: #E0E0E0;
}
/*TOP BANNER SECTION*/
#banner { height:100px; }
#logo {}
#ip_box {
width:200px;
height:43px;
background:#212121;
border-radius: 5px;
box-shadow: 1px 1px 5px;}
#ip_text {
color: white;
font-size: 15px;
}
#teamspeak_box {
width:159px;
height:43px;
background:#212121;
border-radius: 5px;
box-shadow: 1px 1px 5px;
}
#teamspeak_box_2 {
width:43px;
height:43px;
background:#313131;
border-radius: 5px 0px 0px 5px;
}
#teamspeak_text { color: white; }
#teamspeak_image {}

Answer 1

Give the parent div a property :
Position:relative;
Also give the property to child div:
Position:absolute;
Now you can change the places of child div inside the "BANNER" div. by using TOP , BOTTOM, RIGHT, LEFT