como hacer un div contenedor de dos div acomodados en la misma columna, que al momento de minimizar al tamaño de un celular los div se acomoden en filas y no en columnas.
realizar estos div de manera responsiva, en el cual el principar contenga ambos y en la vista de pc se vean en uno al lado del otro, y en una vista de movil se vena uno sobre otro.
tengo un que contiene el div de la descripcion y el de actualizar , lo que quiero es que al minimizar se vea en filas osea primero 1 y despues otro
que no queden en la misma fila, si no que quede uno abajo del otro
<div class="row justify-content-between ">
<div class="col-4">
<h6>Descripción de la oportunidad</h6>
<p class="text-muted" style="text-align: justify;">{{opcDesc descripcion historial }}</p>
</div>
<div class="table-responsive col-8">
<h6>Actualizar seguimiento </h6>
<table class="table table-sm table-bordered " style="font-size: 12px">
<tbody>
<tr>
<td class="text-right font-weight-bold table-active" style="max-width: 100px;">Descripción del
seguimiento Actual
</td>
<td style="min-width: 250px; max-width: 280px; "><span class="text-muted">{{descripcion}}</span>
<input type="hidden" name="DescAct" value="{{descripcion}}">
</td>
</tr>
<tr>
<td class="text-right font-weight-bold table-active">Agendado</td>
<td style="min-width: 250px; "><span class="text-muted " data-toggle="tooltip" data-placement="top"
title="{{dateformatHover fechaAgendado}}">{{dateformat fechaAgendado}}</span>
<input type="hidden" name="agendado" value="{{fechaAgendado}}">
</td>
</tr>
<tr>
<td class="text-right font-weight-bold table-active">Tipo de acción</td>
<td style="min-width: 250px; "><span class="{{colorTipo tipoAccion}}">{{nombreTipo tipoAccion}}</span>
<input type="hidden" name="tipoAccion1" value="{{tipoAccion}}">
</td>
</tr>
<tr>
<td class="text-right font-weight-bold table-active"><span style="color:red">*</span>Resultado</td>
<td style="min-width: 250px; "><textarea class="form-control" style="resize: none; font-size: 12px"
name="resultado" id="" cols="30" rows="2" required></textarea>
</td>
</tr>
<tr>
<td class="text-right font-weight-bold table-active">Etapa de Venta</td>
<td style="min-width: 250px; ">
<input type="hidden" name="idEtapaVenta" value="{{idEtapaVenta}}">
<select class="form-control form-control-sm etapaVenta" name="etapaVenta">
<option>Selecciona una etapa</option>
{{#each etapasVentas}}
<option value="{{tipo}} {{idEtapaVenta}}">{{nombre}}</option>
{{/each}}
</select>
</td>
</tr>
</tbody>
</table>
</div>
</div>