jQuery y AJAX no me coge bien bootstrap

Estoy intentando hacer un scroll infinito con jQuery, AJAX y PHP. Al mostrar los datos me los muestra bien, el problema es que cada vez que me muestra en este caso un card con el contenido en el bucle, me lo pone cada vez más hacia la derecha y obviamente no queda todo alineado.

Además, para que vuelva a cargar más datos, tengo que hacer scroll hasta el principio del todo para que cargue el demás contenido si no, no lo carga automáticamente.

jQuery:

<div class="col-md-10 col-sm-12 offset-md-1 mb-4 ">
					<div class="card mt-3 border-0 rounded-0 results">
						
				</div>
			</div>
<script type="text/javascript">
            var start = 0;
            var limit = 5;
            var reachedMax = false;

        $(window).scroll(function () {
            if ($(window).scrollTop() == $(document).height() - $(window).height())
                getData();
        });

        $(document).ready(function () {
           getData();
        });

        function getData() {
            if (reachedMax)
                return;

            $.ajax({
               url: 'publicaciones.php',
               method: 'POST',
               dataType: 'text',
               data: {
                   getData: 1,
                   start: start,
                   limit: limit
               },
               success: function(response) {
                    if (response == "reachedMax")
                        reachedMax = true;
                    else {
                        start += limit;
                        $(".results").append(response);
                    }
                }
            });
        }
    </script>

PHP:

<?php
	session_start();
	include ('../conexion.php');
	
if(isset($_SESSION['id']))
{
	$id = mysqli_real_escape_string($conexion, $_SESSION['id']);
	
	$infouser = mysqli_query($conexion, "SELECT * FROM users WHERE id = $id");	
	$use = mysqli_fetch_array($infouser);
}

if(isset($_POST['getData']))
{	
	$start = mysqli_real_escape_string($conexion,$_POST['start']);
	$limit = mysqli_real_escape_string($conexion,$_POST['limit']);
	
	$consulta = mysqli_query($conexion, "SELECT * FROM publicaciones ORDER BY id_pub DESC LIMIT $start, $limit");	

	if(mysqli_num_rows($consulta) > 0)
	{
		$response = "";
		
		while($data = mysqli_fetch_array($consulta)) {
			$response .= "							
				<div class='card-body'>
					<div class='row'>
						<div class='col-sm-2'>
							<div class='img-user rounded-circle'>
								<img class='img-fluid-pub' src='../avatars/".$use['avatar']."' alt='User Image'>
							</div>
						</div>
						<div class='col-sm-10'>
							<a class='text-muted h3' href='perfil.php?id='".$use['id']."'>".$use['usuario']."</a><h3>Seguir</h3>
							<p>".$data['fecha']."</p>
							<p>".$data['titulo']." Me gusta</p>
							<p id='descripcion'>".$data['descripcion']."</p>
							<p class='leermas' onclick='leerMas(this);'>Leer más...</p>				
							<video controls>
								<source src='../anadir-publicacion/publicaciones/".$data['video']."' type='video/mp4'>
								Your browser does not support HTML5 video.
							</video>
							<p>Kcal: ".$data['kcal']." CarbHid: ".$data['carbohidratos']." Prot: ".$data['proteinas']." Gras: ".$data['grasas']." Tiempo: ".$data['tiempo']." Personas: ".$data['personas']." Dinero aprox: ".$data['precio']."€ Categoría: ".$data['categoria'];"</p>
						</div>
					</div>
				</div>
			";
		}
		exit($response);
	}
	else 
		exit('reachedMax');
}	
?>