$fecha1= new DateTime("now");
$fecha2= new DateTime($FechaINI);///$FechaINI es la que traigo de la base de datos y esta guardada como "datatime"
$diff = $fecha1->diff($fecha2);
 
 
echo $diff->days . ' dias';

<div class="mb-3 fondo">
  <label for="exampleFormControlInput1" class="form-label"><b>Elija una Imagen (2)</b></label>
  <input type="file" class="form-control" name="my_files[]" multiple id="archivoInput" onchange="return validarExt()">
</div>

function validarExt()
{
    var archivoInput = document.getElementById('archivoInput');
    var files = document.getElementById('archivoInput').files;
   
    var archivoRuta = archivoInput.value;
    var extPermitidas = /(.png|.gif|.jpg)$/i;
    if(!extPermitidas.exec(archivoRuta)){
        alert('Asegurese de haber seleccionado una Imagen');
        archivoInput.value = '';
        return false;
    }
    if (!files.length) {
      alert('selecciones un fila !');
      return false;


    }
  }
  </script>

<form action="upload.php" method="POST" id="frm-test" enctype="multipart/form-data">
<div class="mb-3 fondo">
  <label for="exampleFormControlInput1" class="form-label"><b>Elija una Imagen </b></label>
  <input type="file" class="form-control" name="file[]" multiple  >

</div>
<button type="submit" type="button" id="btn-enviar" class="btn btn-success btn-block segir_a">Seguir</button>
</form>

if (isset($_FILES["file"]))
{
   $reporte = null;
     for($x=0; $x<count($_FILES["file"]["name"]); $x++)
    {
     echo  $file = $_FILES["file"];
     echo  $nombre = $file["name"][$x];
     echo  $tipo = $file["type"][$x];
    echo   $ruta_provisional = $file["tmp_name"][$x];
    echo   $size = $file["size"][$x];
    echo   $dimensiones = getimagesize($ruta_provisional);
    echo   $width = $dimensiones[0];
    echo   $height = $dimensiones[1];
     echo  $carpeta = "./FilesUploA/";

      if ($tipo != 'image/jpeg' && $tipo != 'image/jpg' && $tipo != 'image/png' && $tipo != 'image/gif')
      {
          $reporte .= "<p style='color: red'>Error $nombre, el archivo no es una imagen.</p>";
      }
      else if($size > 2024*2024)
      {
          $reporte .= "<p style='color: red'>Error $nombre, el tamaño máximo permitido es 1mb</p>";
      }
      else if($width > 2500 || $height > 2500)
      {
          $reporte .= "<p style='color: red'>Error $nombre, la anchura y la altura máxima permitida es de 500px</p>";
      }
      else if($width < 60 || $height < 60)
      {
          $reporte .= "<p style='color: red'>Error $nombre, la anchura y la altura mínima permitida es de 60px</p>";
      }
      else
      {
          $src = $carpeta.$nombre;

          //Caragamos imagenes al servidor
          move_uploaded_file($ruta_provisional, $src);       

          //Codigo para insertar imagenes a tu Base de datos.
          //Sentencia SQL

          echo "<p style='color: blue'>La imagen $nombre ha sido subida con éxito</p>";
      }
    }

    echo $reporte;
}

(function(){
    var button=document.getElementById('btnSubmit')
   
    var input = document.getElementById('images'),
        formdata = false;
    
    function mostrarImagenSubida(source){
        var list = document.getElementById('lista-imagenes'),
            li   = document.createElement('li'),
            img  = document.createElement('img');
        img.src = source;
        li.appendChild(img);
        list.appendChild(li);
    }
    
    //Revisamos si el navegador soporta el objeto FormData
    if(window.FormData){
        formdata = new FormData();
//        document.getElementById('btnSubmit').style.display = 'none';
    }
    
    if(input.addEventListener){
        input.addEventListener('change', function(evt){
            var i = 0, len = input.files.length, img, reader, file;
            //Si hay varias imágenes, las obtenemos una a una
            for( ; i < len; i++){
                file = input.files[i];
//                console.log(file);
                //Una pequeña validación para subir imágenes
                if(!!file.type.match(/image.*/)){
                    //Si el navegador soporta el objeto FileReader
                    if(window.FileReader){
                        reader = new FileReader();
                        //Llamamos a este evento cuando la lectura del archivo es completa
                        //Después agregamos la imagen en una lista
                        reader.onloadend = function(e){
                            mostrarImagenSubida(e.target.result);
                        };
                        //Comienza a leer el archivo
                        //Cuando termina el evento onloadend es llamado
                        reader.readAsDataURL(file);
                    }
                }
            }
        }, false);
    }
    
    //Aplicamos la subida de imágenes al evento change del input file
    if(button.addEventListener){
        button.addEventListener('click', function(evt){
            var i = 0, len = input.files.length, img, reader, file;
            
            document.getElementById('response').innerHTML = 'Subiendo...';
            
            //Si hay varias imágenes, las obtenemos una a una
            for( ; i < len; i++){
                file = input.files[i];
//                console.log(file);
                //Una pequeña validación para subir imágenes
                if(!!file.type.match(/image.*/)){
                    //Si el navegador soporta el objeto FileReader
//                    if(window.FileReader){
//                        reader = new FileReader();
//                        //Llamamos a este evento cuando la lectura del archivo es completa
//                        //Después agregamos la imagen en una lista
//                        reader.onloadend = function(e){
//                            mostrarImagenSubida(e.target.result);
//                        };
//                        //Comienza a leer el archivo
//                        //Cuando termina el evento onloadend es llamado
//                        reader.readAsDataURL(file);
//                    }
                    
//                    Si existe una instancia de FormData
                    if(formdata)
                        //Usamos el método append, cuyos parámetros son:
                            //name : El nombre del campo
                            //value: El valor del campo (puede ser de tipo Blob, File e incluso string)
                        formdata.append('images[]', file);
                }
            }
            
            //Por último hacemos uso del método proporcionado por jQuery para hacer la petición ajax
            //Como datos a enviar, el objeto FormData que contiene la información de las imágenes
            if(formdata){
                $.ajax({
                   url : 'upload.php',
                   type : 'POST',
                   data : formdata,
                   processData : false, 
                   contentType : false, 
                   success : function(res){
                       document.getElementById('response').innerHTML = res;
                   }                
                });
            }
        });
    }
}());

<form action="PrimerPost.php" method="POST" enctype="multipart/form-data" id="form"> 
<div class="container fondo">
<div class="row">
<div class="mb-3 fondo">

  <label  class="form-label"><b>Nombre Completo</b></label>
  <input type="tetx" class="form-control" id="name" name="cl_NomCompleto"  placeholder="Nombre Completo">
</div>

<div class="mb-3">
  <label  class="form-label"><b>DNI</b></label>
  <input type="text" class="form-control" id="cldne" name="cl_DnIE" placeholder="Su DNI">
</div>
<br>

<br>
</div>

<button type="submit" type="button" class="btn btn-success">Seguir</button>
<p class="warnings" id="warnings"></p>
</form>
<br>
<script src="publicar.js"></script> 

const nombre = document.getElementById("name")
const cldne = document.getElementById("cldne")
const form = document.getElementById("form")
const parrafo =document.getElementById("warnings")

    form.addEventListener("submit", e=>{
        e.preventDefault()
        let warnings =""
        parrafo.innerHTML=""
        if(nombre.value.length <4){
            
            warnings +=`El nombre es muy corto <br>`
            entrar= true
        }

        if(cldne.value.length<8){
            warnings +=`El nombre es muy corto <br>`
            entrar= true
        }
        if(entrar){
            parrafo.innerHTML= warnings
        }else{
            //this.submit();
            //document.forms.submit();
            $form.submit();
        }
    })

 if ((isset($anuncio)=="NO" AND (isset($social_id)=="INV"))) {
   $name = ucwords($_SESSION['name']);
   $PrimerItems =  "<a class='nav-link' href='./userspublicar/publicar.php'><spam class='textColor'>Publicar</spam></a>";
    $TercerItems =  "<a class='nav-link' href='#'><spam class='fas fa-user icon-cio'></spam>"."<b>".$name ."</b> </a>";
    $SegundItems =  "<a class='nav-link' href='./salir.php'>Salir</a>";
    $invItem1=null;
    $invItem2=null;

  echo "USUARIO REGISTRADO PERO NO PUBLICO";
  
  } elseif ((isset($social_id)=="INV") AND (isset($anuncio)=="SI" AND ((isset($temporal)=="1")))) {
    $TercerItems=null;
    $invItem1="<a class='nav-link' href='./registrocliente/login/login/index.php'>PublicarSI</a>";
    echo "algooo";
    $PrimerItems=null;
    $invItem2 =null;
    $SegundItems=null;
  echo "USUARIO REGISTRADO PERO SIIIIII PUBLICO (NO ME SALE)";
  
  } elseif ((isset($temporal)<>"1") ){
  
  echo "USUARIO MIRANDO";
  $TercerItems=null;
  $invItem1="<a class='nav-link' href='./registrocliente/login/login/index.php'>Ingresar</a>";
  $PrimerItems=null;
  $invItem2 =null;
  $SegundItems=null;

  }

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
  <link rel="preconnect" href="https://fonts.gstatic.com">
  <link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@300&display=swap" rel="stylesheet">
  <link rel="stylesheet" href="viewpublic.css">
</head>
<body>

</body>
<div class="grid"> 
  <div>
    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
  </div>

  <div>
    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
  </div>

  <div>
    Lorem ipsum dolor sit, amet consectetur adipisicing elit. Voluptas, architecto.
  </div>

</div>

</html>

.grig {
      display : grid;
     /* grid-template-rows: 100px 100px;*/
      grid-template-columns: 33% 33% 33%;
      }
      .grid div {
      background : #ecf0f1;
      padding : 1em;
      }
      .grid div:hover {
      border : #f1c40f solid 1px;
      }

include_once "../config.inc.php";
$con=conectar();
// Recibo los datos de la imagen
$imagen=$_FILES['imagen']['name'];
$tipo=$_FILES['imagen']['type'];
$tamano = $_FILES['imagen']['size'];


//Si existe imagen y tiene un tamaño correcto

if (($imagen == !NULL) && ($_FILES['imagen']['size']= 200000)){
   //indicamos los formatos que permitimos subir a nuestro servidor
   if (($_FILES["imagen"]["type"] == "image/gif")
   || ($_FILES["imagen"]["type"] == "image/jpeg")
   || ($_FILES["imagen"]["type"] == "image/jpg")
   || ($_FILES["imagen"]["type"] == "image/png")){
    $nombre_img = $_POST['cl_comercio'];

 // Ruta donde se guardarán las imágenes que subamos
    
         $directorio ="files/";

            move_uploaded_file($_FILES['imagen']['tmp_name'],$directorio.$nombre_img);
            $nombre_imgn = mysqli_escape_string($con, $nombre_img);
            $query = "INSERT INTO alumnos1 (nombre_img,tipo) values ('".$nombre_img."','".$tipo."');
            ";
        $res = mysqli_query($con, $query);
   
}else{

    echo "no es correcto";

}
}

<img width="100" src="data:<?php echo $row['tipo']; ?>;base64,<?php echo  base64_encode($row['imagen']); ?>">

se ve perfecta, 
Pero el problema esta en que quiero visualizarla en una caja de boostrap... y no me sale.. dejo código : 

	   while($row= $row->fetch_assoc())
	{
		$tabla.='


	
	
  
	
	    <div class="col-lg-4 col-md-12 col-xs-12">
    <div class="card mb-4 shadow-sm">
    <div class="card-body">
    <p class="card-text">Titulo:'.$rows[name'].'</p>
	
	
	<img src="src="data:echo'.$row['tipo'].'.'.$rows['imagen'].'" class="card-img-top" width="500px" height="auto" ></a>  //acá esta el problema no se como hacer para que se vea la imagen ////

    <p class="card-text">This is a wider card with supporting text below as a natural lead-in to additional content. This content is a little bit longer.</p>
    <div class="d-flex justify-content-between align-items-center">
    <div class="btn-group">
                  <button type="button" class="btn btn-sm btn-outline-secondary">View</button>
                  <button type="button" class="btn btn-sm btn-outline-secondary">Edit</button>
                </div>
                
    </div>
    </div>
    </div>
    </div>
                   
              

	  		'

		;
	}