Quiero que la sección con la clase "personajes" guarde de manera horizontal dos elementos con clase "t" por lo que les he puesto col-6 para que cada uno ocupe la mitad del ancho de la sección personajes, pero aunque cada elemento con clase "t" ocupa sólo la mitad, cada elemento se ubica uno debajo del otro y no de dos en dos como deseo. Y ¿ cómo se haría para que el alto de la sección de los personajes no sea auto sino el mismo que el de la sección mapa, no importa que la sección personajes sea más extensa porque le podria poner un scroll. La idea es que la sección personajes quede al lado de la del mapa, por eso les he colocado col-8 a "mapa" y col-4 a personajes.
.mapa {
background-color: antiquewhite;
margin: 0%;
padding: 0%;
}
.personajes {
background-color: burlywood;
margin: 0%;
padding: 0%;
}
.t {
background-color: cadetblue;
margin: 0%;
padding: 0%;
}
<div class="container">
<div class="row">
<div class="col-8 mapa">col-8 <br><br><br><br><br></div>
<div class="col-4 personajes">
<div class="col-6 t">oooooo <br><br><br><br><br></div>
<div class="col-6 t">oooooo <br><br><br><br><br></div>
<div class="col-6 t">oooooo <br><br><br><br><br></div>
<div class="col-6 t">oooooo <br><br><br><br><br></div>
</div>
</div>
</div>