[SOLUCIONADO] error cargar imagen con ajax y posicionarla con css

[lambetdelta]

Buenas soy todo un novato en esto de css, ajax y jquery y si me ayudaran en lo que quiero hacer estaría eternamente agradecido, mi duda es la siguiente:
Tengo un div en mi pagina principal en la cual cargo datos html(se tratan de los datos extraídos de una consulta) desde el servidor con ajax el problema surge cuando cargo una serie de imágenes(estas son generadas de manera dinámica en base a los registros que genera la consulta, el propósito de las imágenes es para eliminar registros de manera individual), yo quiero que las imágenes se posicionen en la parte superior derecha, todo esto se encuentra dentro de un div generado dinamicamente con php(o al menos eso creo) pero las imágenes se posicionan en la parte derecha una detrás del la otra tomando en cuenta el div principal y no el generado en php pongo elcódigo para quien guste ayudarme y de antemano agradezco toda su atención.

DIV principal

Código HTML:

[CODE]<div id="datos_academicos"></div>[/CODE]

función jquery

Código Javascript:

function dt_academicos(no_control){
    $.post('ajax/dt_academicos.php',{no_control:no_control},function(data){
        $("#datos_academicos").html(data);
        });
    }
 

Codigo css

Código CSS:

.div_carrera{
    width:100%;
    height:20%;
    border-color:#666;
    border-width:5px;
    border-style:solid;
    font-size:14px;
    text-align:left;}
.eliminar{
    position:absolute;
    top:10px;
    right:10px;
}
 

y lo que cargo desde el servidor con php

Código PHP:

<?php 
include_once '../includes/functions.php';
include_once '../includes/db_connect.php';
include_once '../includes/psl-config.php';
//$no_control=$_POST['no_control'];
$registros=dt_academicos($mysqli,'10940256');//funcion para extraer los datos de la consulta
echo'<p>Datos Académicos</p>'; 
while($fila=$registros->fetch_assoc()){///mostrar cada registro en su div individual
    echo '<div class="div_carrera"';
    echo "<p>Carrera:<b>".$fila['codigo_carrerafk']."</b></p>";
    echo "<p>Especialidad:<b>".$fila['codigo_especialidadfk']."</b></p>";
    echo "<p>Fecha Inicio:<b>".$fila['fecha_inicio']."</b></p>";
    echo "<p>Fecha de Finalización:<b>".$fila['fecha_fin']."</b></p>";
    echo '<img id="'.$fila['no_registro'].'" src="Imagenes/cancelar.png"  title="ELIMINAR" class="eliminar"/>';//la imagen que no se adapta a su estilo
    echo '</div>';
    }
?>
 

[MMan]

agrega a

Código CSS:

.div_carrera{
    .....
    .....
  position: relative;
 
}
 

[lambetdelta]

Agradezco tu ayuda amigo pero no me funciono, lo posiciono justo debajo del ultimo elemento que es fecha de finalización, lo que me quedo por hacer fue colocarlo a la derecha en la parte inferior con el margen pero no es lo que quiero hahah se me hace raro que para el margen si tome el div dinámico y para el absoluto no(toma el div principal para colocarlo) de cualquier manera te agradezco mucho tu atención y si me pueden seguir ayudando que mejor