Comment aligner ce champ de recherche vers la droite?

Question

Je commence tout juste à comprendre le HTML. Je n'arrive pas à aligner ça à droite, ça fait partie d'un menu. Je veux essentiellement qu'il aligne le champ de recherche à droite afin qu'il ressemble à Facebook ou quelque chose comme ça. Jusqu'à présent, j'ai utilisé le rembourrage, mais je ne peux pas le garder plus longtemps.

<li id="search-10" class="widget_search"> 
<form role="search" method="get" action="http://chusmix.com/"> 
    <div> 
    <input class="ubicacion" type="text" value="" name="s" id="s"> 
    <input type="submit" id="searchsubmit" value="Ir a Ciudad"/> 
    </div> 
    </form></li> 

Merci

Answer 1

Vous avez quelques options:

keep the div(bad way) 
add align"right" to the div 
on the form and remove the div (better way) 
use float:right 
text-align: right 

et lieu que sur la forme et retirez le div.

Aussi je recommande de mettre le style dans un CSS et non dans les éléments html.

Answer 2

Ajouter text-align:right; à votre form et retirez la div inutile. Notez que cela ne fonctionne que pour les éléments en ligne: texte, entrées, ancres, etc. Si vous souhaitez que les boîtes (div, formulaires, tableaux, etc.) s'alignent sur la droite, vous devez utiliser float:right; et définir une hauteur sur le parent de l'élément flottant, ou ajoutez une division claire ci-dessous l'élément flottant. De plus, en plus d'être inutile, cette deuxième approche serait plus compliquée à utiliser pour vous, en tant que débutant.

Answer 3

Personnellement, je ne voudrais pas utiliser une liste

<div id="search-10" class="widget_search"> 
    <form role="search" method="get" action="http://chusmix.com/"> 
    <div style="text-align: right;"> 
    <input class="ubicacion" type="text" value="" name="s" id="s"> 
    <input type="submit" id="searchsubmit" value="Ir a Ciudad"/> 
    </div> 
    </form> 
</div> 

Et je vous propose aussi expérimenter avec text-align