Alignement d'un bloc recherche

Bonjour à tous,

Je souhaite que mon menu horizontal contienne un bloc "recherche". Pour celà, j'ai intégré ce bloc dans la liste ul de mon menu et tout fonctionne parfaitement.

<ul id="navigation">
	<li><a href="#">Accueil</a></li>
	<li><a href="#">A propos</a></li>
	<li><a href="#">Archives</a></li>
	<li><a href="#">Contact</a></li>
	<li><a href="#"  style="text-decoration:underline">Flux Rss</a></li>
    <li id="search"><?php include(TEMPLATEPATH . '/searchform.php'); ?></li>

<p id="texte_search"><strong>Rechercher dans ce blog :</strong></p>
<form method="get" id="searchform" action="http://www.jeremyplasseraud.com/">

<div id="formulaire">
<input type="text" value="" name="s" id="s" />
<input type="submit" id="searchsubmit" value="Ok" />
</div>
</form>
 

Cependant, j'aimerais aligner ce bloc recherche tout à droite. J'ai donc appliqué un padding-left, ce qui donne un résultat satisfaisant sur Firefox mais pas sur les autres navigateurs. (le bloc se décale, saute une ligne..)

#searchform{
display:inline;
}

#formulaire{
display:inline;
}

#texte_search{
display:inline;
}

input#s{
border: 1px solid black;
color:black;
}

#searchsubmit{
border: 1px solid black;
width: 25px;
background-color:black;
color: white;

li#search{
padding-left:350px;
}

J'aimerais donc savoir comment aligner cet élément li pour qu'il soit collé à droite sur tous les navigateurs.

Merci d'avance !
Modifié par jeremyp (05 Aug 2008 - 18:20)

Salut,

regarder du côté des techniques de positionnement ...

li#search {
   float:    right;
}

ou

ul#navigation {
  position:    relative;
}
li#search {
  position:    absolute;
  right:         0;
  top:           0;
}

La deuxième technique marche nikel, merci !