input group under navbar

I want all the elements of the form to be placed under the navbar, but “Ip range” and “subnet” inputs are placed on the navbar, when scrolling. what is solution?

my input code:

                            <div class="col-md-6">
                                <label class="form-label" for="IPrange"> IP Range:</label>
                                <div class="input-group">
                                    <span class="input-group-text ">X.</span>
                                    <input required class="form-control" type="number" v max="254" min="1" name=""
                                        id="IPrange">
                                    <span dir="ltr" class="input-group-text">10.19.</span>
                                </div>
                            </div>

my code:
https://www.sololearn.com/compiler-playground/WqsT4hizryHh