Div control within a php for loop - php

Question

Request:
I would like to control the placement of my dynamic divs. Each div should refer to the parent div.
Problem:
The code below does not allow the div positions to be altered based on the parent div. For example, #dldescription top:10%; should use div id="dlitem" as a guide. I tried several tactics but can't seem to make it work as planned.
<?php
include '/scripts/connect_to_mysql.php';
$result = mysql_query('SELECT * FROM table');
echo '<div id="dlcontainer" style="border-style:groove;">
<div id="dlitem">';
$i= 0;
while ($row = mysql_fetch_array($result))
{
//each style will control the placement of the div relative to the parent div id=dlitem
echo'<style>
#dldescription_'.$i.'{
vertical-align:middle;
position: absolute;
text-align:center;
top:10%;
left:45px;
}
#dlimage_'.$i.'{
vertical-align:middle;
position: absolute;
text-align:center;
top:10%;
left:45px;
}
#dltitle_'.$i.'{
vertical-align:middle;
position: absolute;
text-align:center;
top:10%;
left:45px;
}
#dllink_'.$i.'{
vertical-align:middle;
position: absolute;
text-align:center;
top:10%;
left:45px;
display: inline-block;
}
</style>
<div id="dltitle_'.$i.'" >'.$row['col1'].'</div>
<div id="dlimage_'.$i.'" align="center"><img src =./'.$row['col2'].' width="75" height="150"></div>
<div id="dldescription_'.$i.'" align="center" ><img src="/img/facebookShare.png"> '.$row['col3'].' off</div>
<div class="dllink_'.$i.'" align="center">Limit '.$row['col4'].'</div>
';
$i++;
}
echo '</div></div>';
?>

Answer 1

To make the div's position relatively to the parent div, you need to change their position from absolute to relative, like:
position:relative;
Here's a good guide: http://learnlayout.com/position.html