Mise en forme de la recherche Google

Bonjour,

Je vais être clair je n'adhére pas du tout à Firefox, je l'aime pas. Mais bon je conçois en revanche que certains le considérent comme The navigateur.

Comme je viens de le dire déjà je ne l'aime pas mais quand il me gonfle alors là je le hais carrément.

Ca fait 4 heures que j'essaye de régler un problème sur lequel IE fonctionne tout le temps (je veux dire avec tout ce que j'essaye de faire pour satisfaire FF). Firefox en revanche refuse de me centrer la recherche Google.
J'ai tout essayé, des vertical-align, des padding, des margin rien à faire Firefox me hais également je crois.
Cette obligation de centrer la recherche Google via la feuille de style est arrivée suite à la suppression de "align = "center"" dans le script HTML car W3C ne l'accepte pas: Erreur.

Alors voici un lien (avec une mise en page qui fonctionne sous IE) où FF me titille les nerfs de moi.

-http://www.micro-astuce.com/courrier/accueil-courrier

Le code HTML :

<!-- SiteSearch Google -->
<div id="recherche">
<form method="get" action="http://www.google.fr/custom">
<p class="google-recherche">
<img src="http://www.micro-astuce.com//Forum/images/recherche" alt="Google"></img>
<input type="hidden" name="domains" value="www.micro-astuce.com" />
<input type="text" name="q" size="24" maxlength="255" value="" />
<input type="submit" name="sa" value="Google" />
<input type="radio" name="sitesearch" value="" checked="checked" />
<span class="google">Web</span>
<input type="radio" name="sitesearch" value="www.micro-astuce.com" />
<span class="google">Micro-Astuce</span>
<input type="hidden" name="client" value="pub-0188520534855173" />
<input type="hidden" name="forid" value="1" />
<input type="hidden" name="ie" value="ISO-8859-1" />
<input type="hidden" name="oe" value="ISO-8859-1" />
<input type="hidden" name="cof" value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:336699;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1;" />
<input type="hidden" name="hl" value="fr" /></p>
</form>
</div>
<!-- SiteSearch Google -->

Et la feuille de style :

 #recherche
 {
margin-left : -3px;
width: 100%;
height: 47px;
border : 1px solid transparent;
background-image: url(/Forum/images/Blue_background2.gif);
 }
 
 .google-recherche
{
Vertical-Align: middle;
border : 1px solid transparent; 
padding-left: 25px;
text-align: left;
margin-left: 2px;
}

Merci de votre lecture.
Modifié par renard11 (09 May 2007 - 18:31)

Bonjour,

Concernant les problème d'affichage, il faut toujours vérifier que sa feuille de style soit valide (souvent on cherche longtemps pour rien, juste à cause d'une erreur de syntaxe).

Pour ton souci de CSS il suffit de mettre la valeur auto au height de ton conteneur #recherche.

Sinon, lorsque l'on crée un site, et qu'on souhaite qu'il soit multi navigateur, il vaut mieux commencer sur de bonne base (si tu n'aimes pas FF avec l'extension Webdevelloper, tu peux essayer Opéra). Une fois le navigateur conforme choisi, et la css figée. Tu finalise la CSS pour corriger les bug d'IE.

En gros, si ton site passe sous Firefox et Opéra, puis sous IE6/7, ton site passera sous 95 % des navigateurs.
Modifié par Super_baloo8 (06 May 2007 - 13:36)

Pour centrer horizontalement un élément, tu peux lire ce tutoriel qui explique comment centrer les éléments ou un site web en CSS.

Merci de votre réponse.

Mais finalement j'ai pensé à donner une class à l'image de la recherche, car c'est elle qui décale la fenêtre de recherche sous FF :

img.img-recherche
{
position: absolute;
top: 135px; 
left: 10px;
}

A cela j'ai ajouté un margin:

margin : 8px 2px 0 40px !important;   /* Pour les navigateurs autre que IE */
margin : 8px 2px 0 20px; 

Et ça fonctionne. Aussi bien sous IE que sous Google.

renard11 a écrit :
Et ça fonctionne. Aussi bien sous IE que sous Google.

Heuuu... à ma connaissance, Google n'a pas encore inventé de navigateur que je sache

a écrit :
Heuuu... à ma connaissance, Google n'a pas encore inventé de navigateur que je sache

Je voulais dire FF bien sûr.
Modifié par renard11 (06 May 2007 - 14:32)

a écrit :


Je voulais dire FF bien sûr.

Ok, pas de soucis
Modifié par touvert (06 May 2007 - 14:33)

Bonjour,

Pourrais-tu éditer ton premier message afin de modifier le titre pour qu'il soit un peu plus explicite, comme cela est stipulé dans les règles ?
Car d'éventuelles recherches ultérieures sur ce sujet risqueront de ne pas aboutir ...

a écrit :
Pourrais-tu éditer ton premier message afin de modifier le titre pour qu'il soit un peu plus explicite, comme cela est stipulé dans les règles ?

Fait