Me ajudem, por favooor!

Bootstrap

21/06/2022

Olá Pessoal,

seguinte, eu tenho uma div que contém alguns dados para filtro do hotel que a pessoa quer pesquisar.

ele é montado assim:
<div class="row justify-content-center">

<div class=" col-12 col-lg-3">
<h4>Filtrar por:</h4>
<div class="info-left form-group-lg">

<div class="price">
<h4>Valor da diária</h4>

<fiedlset class="cost">

<p class="cost__inputs">
<label class="cost__label">
<input class="cost__input" type="number" value="0" min="0" max="12000" />
</label>
<label class="cost__label">
<input class="cost__input" type="number" value="9000" min="0" max="12000" />
</label>
</p>
<p class="range-slider cost__range" style="--first-val: 0%; --second-val: 75%;">
<input class="range-slider__input" type="range" min="0" max="12000" value="0" step="100" aria-label="Min range"/>
<input class="range-slider__input" type="range" min="0" max="12000" value="9000" step="100" aria-label="Max range"/>
</p>
</fiedlset>
</div>

<div class="categorie">
<h4>Categoria</h4>
<form action="">

<label class="box">
<img src="./assets/img/onestar.png" alt="">
<input type="checkbox" id="one" name="one" value="one"><span class="numberqnt">(0)</span>
<span class="checkmark"></span>
</label>

<label class="box">
<img src="./assets/img/twostar.png" alt="">
<input type="checkbox" id="two" name="two" value="two"><span class="numberqnt">(0)</span>
<span class="checkmark"></span>
</label>

<label class="box">
<img src="./assets/img/treestar.png" alt="">
<input type="checkbox" id="tree" name="tree" value="tree"><span class="numberqnt">(0)</span>
<span class="checkmark"></span>
</label>

<label class="box">
<img src="./assets/img/fourstar.png" alt="">
<input type="checkbox" id="four" name="four" value="four"><span class="numberqnt">(0)</span>
<span class="checkmark"></span>
</label>

<label class="box">
<img src="./assets/img/fivestar.png" alt="">
<input type="checkbox" id="five" name="five" value="five"><span class="numberqnt">(0)</span>
<span class="checkmark"></span>
</label>


</form>
</div>

</div>
</div>

Mas se vc testar aí, vc vai ver que ele fica meio que desalinhado na esquerda, por causa do width que está errado em algum lugar.

Alguem poderia me dar uma luz?
Henrique

Henrique

Curtidas 0

Respostas

Marcos André

Marcos André

21/06/2022

Olá Henrique, você consegue resolver facilmente esse problema de alinhamento com a linguagem CSS. Se você usou CSS nesse código, tente enviar aqui o arquivo para análise se for possível. ;)
GOSTEI 0
POSTAR