Wie kann ich ein Formular auf großen Bildschirmen nach rechts schieben und in die Mitte auf kleinen Bildschirmen setzen

Question

Ich möchte meine Suchleiste auf großen Bildschirmen auf der rechten Seite des Bildschirms sein, während es in der Mitte auf kleinen Bildschirmen sein sollte

die Form ist eine Bootstrap-4 Form, Dies ist Code für die navbar:

<nav class="navbar navbar-expand-sm navbar-dark navbar-inverse bg-dark justify-content-between fixed-top"> 
     <a class="navbar-brand d-none d-sm-block text-white">Daking</a> 
     <form class="form-inline my-2 my-lg-0 "> 
      <input class="form-control mr-sm-2" type="text" placeholder="Search" aria-label="Search">  
     </form> 
    </nav> 

I Medienabfrage für kleine Bildschirme verwendet:

@media only screen and (min-width : 480px) { 
    form { 
    width: 100% ; 
    position: relative; 
} 
} 

Aber auf großen Bildschirmen (Desktop), positioniert sie es in der Nähe der Marke (Daking)

Answer 1

@media only screen and (min-width : 480px) { 
    form { 
     width: auto; 
    position: relative; 
    float: right; 

    } 
}