Rechercher bouton dans la boîte de recherche comme Bing

Question

Comment puis-je mettre en œuvre un bouton de recherche dans la zone de recherche, comme on le voit sur un site comme Bing?

Answer 1

Il ressemble qu'il est entré dans mais pas (vous ne pouvez pas mettre HTML à l'intérieur d'une entrée).

Les 2 éléments (une entrée et un bouton) sont proches les unes avec 0 marge et les deux ont la même hauteur. Le graphique du bouton a une marge blanche 3px. Ainsi, il crée cet effet.

Une majoration possible et le style pourrait être:

<input type="text" id="q" />
<input type="button" id="b" value="Search" />


#q, #b { 
   margin: 0 
}
#q { 
   padding: 5px; 
   font-size: 2em; 
   line-height: 30px 
}
#b { 
   /* image replacement */
   text-indent: -99999px; 
   width: 30px; 
   height: 30px; 
   display: block;
   background: gray url(button.png) 0 0 no-repeat;

   /* placing next to input using float or absolute positioning omitted ... */
}

Answer 2

Un cool Bing comme champ de recherche (bouton à l'intérieur)