[Firefox 2] Modifier le syle d'un élément d'une page web

Salut,

jh a tapoté, le 04/08/2012 03:09:

Bonjour,

Je souhaite modifier la hauteur du formulaire de recherche des pages web
de google (la 1ère mais aussi les suivantes) :

<input class="lst" value="" title="Recherche Google" maxlength="2048"
name="q" size="57" style="color:#000;margin:0;padding:5px 8px 0
6px;vertical-align:top">

et ds les pages suivantes :

<input class="lst" value="TEXTE DE RECHERCHE" title="Rechercher"
id="sbhost" autocomplete="off" type="text" name="q" maxlength="2048">


Comment faire sous Firefox pour imposer une hauteur de formulaire plus
grande ? Une extension ? une modification dans le about:config ? une
modification dans les fichiers de préférences js ?

Il suffit de passer par un fichier userContent.css, à créer et adapter
au besoin, firebug peut t'aider à trouver ce que tu dois y mettre.


<http://www-archive.mozilla.org/unix/customizing.html>
<http://www.geckozone.org/articles/2005/08/31/100-comprendre-le-profil/>

Pour voir la syntaxe mais, ça n'a rien à voir avec ta demande ; voici
par exemple ce que j'ai pour google dans mon userContent.css :

@-moz-document
domain(google.fr){
.l:visited,.l:visited:hover,a.l:visited,a.l:visited:hover,
#ires span.tl h3.r a.l:visited{
font-style:italic!important;
font-weight:normal!important;
color:#58556B!important;
}
}
@-moz-document
domain(google.com){
.l:visited,.l:visited:hover,a.l:visited,a.l:visited:hover,
#ires span.tl h3.r a.l:visited{
font-style:italic!important;
font-weight:normal!important;
color:#58556B!important;
}
}


--
Stéphane <http://pasdenom.info/fortune/?>
BOFH excuse #61:

not approved by the FCC

Il suffit de passer par un fichier userContent.css, à créer et adapter
au besoin, firebug peut t'aider à trouver ce que tu dois y mettre.

merci, j'ai utilisé :

@-moz-document
domain(google.fr),
domain(google.com) {
.lst {height: 200px !important; background-color: #999999;}
}

la couleur est appliquée mais pas la hauteur ?!

ça fonctionne si je force Affichage=>Style de la page => Aucun style ds
le menu de Firefox

si je laisse Affichage=>Style de la page => Style de base de la page,
seule la couleur est appliquée, pas la hauteur

jh

Il suffit de passer par un fichier userContent.css, à créer et adapter
au besoin, firebug peut t'aider à trouver ce que tu dois y mettre.

avec

@-moz-document
domain(seek.fr),
{
input {height: 200px !important; background-color: #999999;}
}

ça fonctionne pour le moteur www.seek.fr..

jh

avec :

@-moz-document
domain(google.fr), domain(google.com) {
.lst {height:60px !important;}
}

ça ne fonctionne pas sur la page d'accueil mais sur les suivantes, ce
qui est déja très bien.

jh

il y avait un style sur un <div> qui fixait le height;

au final mon userContent.css contient :

@-moz-document
url-prefix(http://www.google.fr/) {
.lst {height:60px !important; background-color: #FFF0BC !important;}
.ds {height:60px !important; background-color: #FFF0BC !important;}
}

ça n'est pas parfait esthétiquement mais ça ira très bien, merci pour
l'aide.

jh

j'ai affiné grâce à l'extension Firebug que je découvre et qui est
excellentissime !

@-moz-document
url-prefix(http://www.google.fr/) {
.lst {height:60px !important; background-color: #FFF0BC !important;}
.lsb {height:60px !important;}
.ds {height:60px !important; background-color: #FFF0BC !important;}
}

encore merci !

jh