Przesunięcie elementu z utrzymaniem responsywności

0

Muszę przenieść pole "Personal Id Number" w prawy dolny róg (pod "Last Name", obok "Address").

Wszystkie pola z wyjątkiem "Personal Id Number" są opakowane w następujący sposób:

<fieldset class="form-group">
    <div id="register_user" class="form-inline">
        <div class="form-group">
            <input id="register_user_username" name="register[user][username]" required="required" placeholder="Username" class="form-control" type="text">
        </div>
        // itd.
    </div>
</fieldset>

Obok fieldset jest kod dotyczący pola "Personal Id Number":

<div class="form-group personal-id-number">
    <input id="register_personalIdNumber" name="register[personalIdNumber]" required="required" placeholder="Personal Id Number" class="form-control" type="text">
</div>

Problem leży w tym, że pole "Personal Id Number" znajduje się w innym kontenerze niż pozostałe.
Mogę pożądane pole przesunąć we wskazane miejsce ale wówczas sypie się responsywność.

title

0

Lepiej byloby jakbys pokazal kod calego formularza, bo nie wiemy w jakim "innym" kontenerze lezy to pole i w ogóle dlaczego ejst w innym kontenerze.

0

Kod Html został wygenerowany przez to narzędzie: https://symfony.com/doc/current/forms.html
Struktura formularza:

<form name="register" method="post">
    <div id="register">
        <fieldset class="form-group">
            <div id="register_user" class="form-inline">
                <div class="form-group">
                    <input type="text" id="register_user_username" name="register[user][username]" required="required" placeholder="Username" class="form-control" />
                </div>
      ...
            </div>
        </fieldset>
        <div class="form-group">
            <input type="text" id="register_personalIdNumber" name="register[personalIdNumber]" required="required" placeholder="Personal Id Number" class="form-control" />
        </div>
   </div>
</form>
0

to przekopiuj tego diva do kontenera innych zeby to scalic:

<form name="register" method="post">
    <div id="register">
        <fieldset class="form-group">
            <div id="register_user" class="form-inline">
                <div class="form-group">
                    <input type="text" id="register_user_username" name="register[user][username]" required="required" placeholder="Username" class="form-control" />
                </div>
      ...

                <div class="form-group">
                    <input type="text" id="register_personalIdNumber" name="register[personalIdNumber]" required="required" placeholder="Personal Id Number" class="form-control" />
                 </div>
            </div>
        </fieldset>
        
   </div>
</form>
0

Formularz jest generowany z poziomu kontrolera w Symfony.
Nie mam dojścia do pełnego kodu formularza.
Dlatego nie mogę przenieść od tak tego pola do kontenera.

Chce tylko wiedzieć czy jest możliwość na przesunięcie tego elementu we wskazane miejsce wraz z utrzymaniem responsywności jeśli znajdują się w osobnych blokach?

0

nie rozumiem slowa "przesuniecie" w tym kontekscie. skoro nie mozesz fizycznie przesunac.. to jak?? javascriptem po wygenerowaniu strony, czy css poprzez zrobienie wszystkiego floatem i rzezbieniu w ("g...") brazie :):)

0

O takie "przesunięcie" mi chodzi:

position: absolute;
top: 30%; 
left: 70%;

Jedyne co mam do dyspozycji to wspomniany css lub js.
W jaki sposób ostylować ten element aby znajdował się we wskazanym przeze mnie miejscu i odpowiednio się skalował?

1 użytkowników online, w tym zalogowanych: 0, gości: 1