Buenas estoy intentando ponerle un titulo pequeño a cada div algo como un h4 o h5 pero no se como hacer para posicionarlo bien. Ademas estoy tratando de poner lineas de separación entre las cajas pero utilizo hr y no cambia nada, las lineas de separacion no aparecen.
<div class="producto form-row">
<div class="form-group col-md-3">
<label for="ptype_id">Tipo de Producto</label>
<select name="ptype_id" class="form-control" required>
<option value="">Seleccionar</option>
@foreach ($ptypes as $ptype)
<option value="{{ $ptype->id }}">{{ $ptype->productType }}</option>
@endforeach
</select>
</div>
<div class="form-group col-md-3">
<label for="brand_id">Marca</label>
<select name="brand_id" class="form-control" required id="select-brand">
<option value="">Seleccionar</option>
@foreach ($brands as $brand)
<option value="{{ $brand->id }}">{{ $brand->brandName }}</option>
@endforeach
</select>
</div>
<div class="form-group col-md-3">
<label for="model_id">Modelo</label>
<select name="model_id" class="form-control" id="select-model" required>
<option value="">Seleccionar</option>
</select>
</div>
</div>
<div class="costo form-row">
<div class="title" style="position: absolute; ">
<h5>Costo</h5>
</div>
<div class="form-group col-md-4">
<label for="coin">Moneda</label>
<select name="coin" class="form-control" required>
<option value="">Moneda </option>
<option value="ARS">ARS</option>
<option value="USD">USD-O</option>
<option value="USDB">USD-B</option>
<option value="EUR">EUR</option>
</select>
</div>
<div class="form-group col-md-2">
<label for="cost">Costo</label>
<input type="number" step="00.01" name="cost" class="form-control" required>
</div>
<div class="form-group col-md-2">
<label for="fob">Costo Fob</label>
<input type="number" step="00.01" name="fob" class="form-control" required>
</div>
<div class="form-group col-md-2">
<label for="costUSD">Costo USD</label>
<input type="number" step="00.01" name="costUSD" class="form-control" required>
</div>
<div class="form-group col-md-2">
<label for="costUSDB">Costo USDB</label>
<input type="number" step="00.01" name="costUSDB" class="form-control" required>
</div>
<div class="form-group col-md-2">
<label for="costNacionalizacion">Costo Nacionalizacion</label>
<input type="number" step="00.01" name="costNacionalizacion" class="form-control" required>
</div>
<div class="form-group col-md-2">
<label for="costARS">Costo ARS</label>
<input type="number" step="00.01" name="costARS" class="form-control" required>
</div>
</div>
Por ejemplo en el div con clase producto quiero que haya un titulo que diga "informacion del producto" y abajo los campos del formulario de ese div. Y cuando finaliza el div un
para separar del div con clase costo. Pero no logro posicionarlos bien.
<hr>
.