#51 Le 04/06/2007, à 09:54
- Bismut
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Les garder dans un coin et les refaire...
Mac Mini 2009 avec Archlinux
Asus EeePC S101 avec Archlinux
HTC Magic avec Android
Hors ligne
#52 Le 04/06/2007, à 09:58
- belga
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
C'est ce que je fais.
Pas d'autres solutions quoi?
Multi-bomb : Multi-doze : Mandoze, Ubundoze, Pardoze.
900s entre deux postes: mododoze
Hors ligne
#53 Le 07/06/2007, à 21:40
- Ras'
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
J'avais aussi le problème pour la barre de menu de navigation de ubuntu-fr mais ça a disparu sans que je ne touche à rien ...
Par contre j'ai un problème, depuis que j'ai mis ce gadget firefox bugg sur certains "champ d'écriture" (me rapelle plus le nom exact, là ou on entre un pseudo et un mdp)
par exemple un pote se loggue sur le site de voila et quand il écrivais dans la case il ne voyait que la moitié supérieure de caractères, enfin c'était pas centré... 
Va t'faire shampouiner par le compteur_V2 en timezone[Canada/Eastern] !
Les types awesome n'ont rien à prouver. À personne.
'k bye là
Hors ligne
#54 Le 07/06/2007, à 22:17
- AuraHxC
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
J'ai eu le même soucis que toi pour les champs ou l'on voit que la moitié mais je sais plus si j'ai fait quelque chose ou bien si ca c'est résolu tout seul...
Hors ligne
#55 Le 07/06/2007, à 22:59
- pierluc
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Est-ce que vous pouvez résumer? Si je veut remplacer les affreux boutons de formulaires ainsi que les petits ronds de formulaires par quelque chose de beau je fais quoi?
Porte-Folio: http://pearluc.wordpress.com
Linux, là où la main de l'homme n'a jamait mit pied.
Capitaine Patnaud, Émission Dans une galaxie près de chez vous
Pour rire: www.tetesaclaques.tv
Hors ligne
#56 Le 08/06/2007, à 00:49
- AuraHxC
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Dans la page deux, on te file un code forms.css, ben tu fais un fichier forms.css, tu colle dedans le contenu que l'on te donne et tu le met dans /usr/lib/firefox/res/ et voila
Hors ligne
#57 Le 08/06/2007, à 11:06
- pmd
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Perso, j'ai choisis de ne modifier que les bouton "checkbox" et "radio". Il faut rajouter le code suivant dans /usr/lib/firefox/res/forms.css :
/* AJOUTE PAR MOI */
/* Radio buttons */
input[type="radio"] {
width: 13px;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAABE5AAAROQEb2ZNGAAAAB3RJTUUH1AoPBic2RlqnIAAAAB10RVh0Q29tbWVudABDcmVhdGVkIHdpdGggVGhlIEdJTVDvZCVuAAABTUlEQVR42n3QP2sTARyH8c%2F9aVNSOugRFURaoZObm4PvwBcg7Sri1sX3kM28iOwqwbWYycGEYukiwgXkhsA1moYIqXp3ORfFiiHP%2Fvx4vr%2FAv9zCHhI08D2KnFdV%2FJnyixXcxxGOMUGFMV6GHMax%2FVXCCxTtdrtO07QuiqIejUZVp9OZ4SQMPbXhztWkIxT9fr9exWAwmAWC13iIJjzAcbvdrtfR7XbPosizrS0teIRJmqZrpTzPZ3iu2bwZ%2Fv7S9d3dXetIkmQniMNLi0UZEi2QZ1m2XCfN5%2FNpXS2%2F4kcoqs7xrtfrfVsnnZ5%2BeK82xk%2FiOMFjnAyHw4tVe7Is%2BxgKD3ED0Z9DdwOeCIJX3W73LM%2FzWVmW1XQ6nfTf9t%2FgAPvYgOBvwObtWLVXBst7ajvUl0JTy2hM9QkXKP4PbzSaSLZp4VpLaxubV5PgFxDO36GrPHeyAAAAAElFTkSuQmCC") no-repeat center !important;
border: none !important;
background-color: inherit !important;
}
input[type="radio"]:focus:not([class]):not([id]):not([style]),
input[type="radio"]:focus,
input[type="radio"]:active:focus,
input[type="radio"][disabled],
input[type="radio"][disabled]:hover {
border:none !important;
}
input[type="radio"]:checked {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAABE5AAAROQEb2ZNGAAAAB3RJTUUH1QsZFzQH6MHdmQAAAB10RVh0Q29tbWVudABDcmVhdGVkIHdpdGggVGhlIEdJTVDvZCVuAAABn0lEQVQoz32Sv4vTYByHnzfJ3Xs0OEitFUQ46S21k04GTkjn224RbxURHO6fELKZqX%2BABDdRBx3PZm%2B45aAEQwqS4aA9zdVC%2FUHy9usgcorFZ%2F%2FA55fib64B20AT0MB322ZmjPMR6k%2Bs4TZwCBwBZ4ABToFXFhw4DjvrBM%2BAKggCyfNcqqqSyWRiwjCcA8eWxSM2uPGnpUOgiuNY1jEajeYK9QbYBRoAd4GjIAhERCTLMvF9X7TW4vu%2BZFkmIiJRFJ3YNo%2B3tmgpYA94nuf5lU6nQ7%2Ffp9fr0e12SdOU8XhMHMfMZrMv7Xb7KY3GC4B9wFRVJSIiWmsZDAbi%2B764ritaaxERqevaKMd6AjQtsL8C06IoVgCe55GmKUmSsFwu8TwPgMViUYpZfQZ%2BgM0d4GUYhvP%2FZRoO378D7gGb4DhN4D5wnCTJ%2Bbr2iqJILawD4Cpg%2F679poKHKPU6iqKT6XQ6r%2BvalGV5Fg%2Fjt8ADYAfYAFAX%2B25edzDbtVrdQrgE8g2LkpV9CuYDcA5U%2Fx5J6wbQdKEFXG7Rcn9luLAE8BNb3%2FD89tWhJgAAAABJRU5ErkJggg%3D%3D") !important;
}
*::-moz-radio {
border: none !important;
background-color: transparent !important;
}
/* Checkboxes */
input[type="checkbox"] {
width: 12px;
height: 12px;
border-width: 0 !important;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH1AgMECE6aWhvwQAAADlJREFUeNpjZGBgsGRgYFBiIBKwQBXvJlI9GwsS5zUh1f%2F%2F%2F%2F%2FHxEAiGNVAEw2wiGP7%2F%2F%2F%2FP2I0AAAC1gpD9bqgwgAAAABJRU5ErkJggg%3D%3D") no-repeat center !important;
background-color: -moz-Field !important;
}
input[type="checkbox"]:checked {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH1QwMBQERdGGm3QAAAJ1JREFUKM%2BN0TFqQkEUheFv5CVLsLHLBlK7ltekEMRCSFIklumDvWQX1u7Nk2YeTMToDAzM4Z7%2FXu6cgiWedJ6hmk%2Bd%2FkcYMUe5cb9QkmTW0fUHn5O4B%2ByxqlP%2BAA%2F4uDAf8IZg1xZGLGrhtXb7rjp4mXZJkksgODbvTbt8C8yxbYznqsstoOC9mtfXvvcaUPD8Xx5JMkwJJjn3RP0Lq9s0z9fV%2B5QAAAAASUVORK5CYII%3D") !important;
}Hors ligne
#58 Le 18/07/2007, à 23:04
- nanolight
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
RavN a écrit :
J'ai utilisé ton deuxième CSS c'est super !
Mais tes codes ont un petit inconvénient, c'est sur la page d'accueil du wiki :
http://pix.nofrag.com/9c/df/f12757c28e7 … 96c83f.gif
Comment enlever ces boutons ?
Merci
Alain.g a écrit :
Houla
Tu ne devrais pas avoir cela, tu as du faire une fausse manip ! (je viens de tester, c'est OK)
Peux-tu donner le contenu du fichier pour que je vois d'où vient l'erreur
Bonjour, ca date un peu mais j'ai aussi le meme problème que RavN pour les boutons du wiki ubuntu.
Par contre moi j'ai récupérer le fichier original sur le site de l'auteur : ( http://emps.l-c-n.com/articles/94/ ) : Prettywidgets-Linux.tgz que j'ai simplement décompressé et j'ai pris les fichiers du dossier 1.9 que j'ai directement copié dans res ca marche nikel sauf ca.
Voici mon form.css:
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is mozilla.org code.
*
* The Initial Developer of the Original Code is
* Netscape Communications Corporation.
* Portions created by the Initial Developer are Copyright (C) 1998
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
* Philippe Wittenbergh (phiw@l-c-n.com)
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/* ******
* Mac OS X look contribution by
* phiw - Philippe Wittenbergh (phiw@l-c-n.com) http://emps.l-c-n.com/
* hiro - NAKAJIMA Hiroki http://homepage.mac.com/travellers/software/Firefox/aquafirefox_en.html
*
* last updated 2006.02.06
*
*
****** */
/**
Styles for old GFX form widgets
**/
@namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */
@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
*|*::-moz-fieldset-content {
display: block;
height: 100%; /* Need this so percentage heights of kids work right */
}
/* miscellaneous form elements */
legend {
padding-left: 2px;
padding-right: 2px;
border: none;
position: static ! important;
float: none ! important;
}
fieldset {
display: block;
margin-left: 2px;
margin-right: 2px;
padding: 0.35em 0.625em 0.75em;
border: 2px groove ThreeDFace;
}
label {
cursor: default;
}
/* default inputs, text inputs, and selects */
/* Note: Values in nsNativeTheme IsWidgetStyled function
need to match textfield background/border values here */
input {
-moz-appearance: textfield;
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here, for buttons, and for <select> (including its
internal padding magic) */
padding: 1px 0 1px 0;
border: 2px inset ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: -moz-field;
line-height: normal !important;
text-align: start;
text-transform: none;
word-spacing: normal;
letter-spacing: normal;
cursor: text;
-moz-binding: url("chrome://global/content/platformHTMLBindings.xml#inputFields");
text-indent: 0;
-moz-user-select: text;
}
input > .anonymous-div {
white-space : nowrap;
}
textarea {
margin: 1px 0 1px 0;
border: 2px inset ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: medium -moz-fixed;
text-align: start;
text-transform: none;
word-spacing: normal;
letter-spacing: normal;
vertical-align: text-bottom;
cursor: text;
-moz-binding: url("chrome://global/content/platformHTMLBindings.xml#textAreas");
-moz-appearance: textfield;
text-indent: 0;
-moz-user-select: text;
}
textarea > scrollbar {
cursor: default;
}
textarea > .anonymous-div,
input > .anonymous-div {
overflow: auto;
border: 0px !important;
padding: 0px;
margin: 0px;
/* XXXldb I'm not sure if we really want the 'text-decoration: inherit',
but it's needed to make 'text-decoration' "work" on text inputs. */
text-decoration: inherit;
}
select {
margin: 0;
border-color: ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: -moz-list;
line-height: normal !important;
white-space: nowrap !important;
text-align: start;
cursor: default;
-moz-box-sizing: border-box;
-moz-user-select: none;
-moz-appearance: menulist;
border-width: 2px;
border-style: inset;
text-indent: 0;
}
/* Need the "select[size][multiple]" selector to override the settings on
'select[size="1"]', eg if one has <select size="1" multiple> */
select[size],
select[multiple],
select[size][multiple] {
/* Different alignment and padding for listbox vs combobox */
vertical-align: text-bottom;
padding: 1px 0 1px 0;
-moz-appearance: listbox;
}
select[size="0"],
select[size="1"] {
/* Except this is not a listbox */
vertical-align: baseline;
padding: 0;
-moz-appearance: menulist;
}
select > input[type="button"] {
width: 12px;
height: 12px;
white-space: nowrap;
position: static !important;
background-image: url("arrow.gif") !important;
background-repeat: no-repeat !important;
background-position: center !important;
-moz-appearance: menulist-button;
}
select > input[type="button"]:active {
background-image: url("arrowd.gif") !important;
}
select:empty {
min-width: 2.5em;
}
*|*::-moz-display-comboboxcontrol-frame {
overflow: -moz-hidden-unscrollable;
/* This top/bottom padding plus the combobox top/bottom border need to
add up to the top/bottom borderpadding of text inputs and buttons */
padding-top: 1px;
padding-bottom: 1px;
-moz-padding-start: 4px;
-moz-padding-end: 0;
background-color: inherit;
color: inherit;
white-space: nowrap;
text-align: inherit;
-moz-user-select: none;
}
option {
display: block;
min-height: 1em;
line-height: normal !important;
-moz-user-select: none;
text-indent: 0;
}
select > option {
padding-top : 0;
padding-bottom: 0;
-moz-padding-start: 3px;
-moz-padding-end: 5px;
}
option:checked {
background-color: Highlight ! important;
color: HighlightText ! important;
}
optgroup {
display: block;
font: -moz-list;
line-height: normal !important;
font-style: italic;
font-weight: bold;
font-size: inherit;
-moz-user-select: none;
text-indent: 0;
}
optgroup > option {
padding-left: 20px;
font-style: normal;
font-weight: normal;
}
optgroup:before {
display: block;
content: attr(label);
}
*|*::-moz-dropdown-list {
z-index: 2147483647;
background-color: inherit;
-moz-user-select: none;
position: static !important;
float: none !important;
border: 1px outset black !important;
}
input[disabled],
textarea[disabled],
option[disabled],
optgroup[disabled],
select[disabled] {
-moz-user-input: disabled;
-moz-user-focus: ignore;
color: GrayText;
background-color: ThreeDFace;
cursor: default;
}
option[disabled],
optgroup[disabled] {
background-color: transparent;
}
/* hidden inputs */
input[type="hidden"] {
-moz-appearance: none;
display: none;
padding: 0;
border: 0;
cursor: auto;
-moz-user-focus: ignore;
-moz-binding: none;
}
/* image buttons */
input[type="image"] {
-moz-appearance: none;
padding: 0;
border: none;
background-color: transparent;
font-family: sans-serif;
font-size: small;
cursor: pointer;
-moz-binding: none;
-moz-appearance: none;
}
input[type="image"][disabled] {
cursor: inherit;
}
input[type="image"]:focus {
-moz-outline: 1px dotted invert;
}
/* file selector */
input[type="file"] {
-moz-appearance: none;
white-space: nowrap;
cursor: default;
-moz-binding: none;
padding: 0 !important;
border-style: none !important;
}
input[type="file"] > input[type="text"][disabled] {
border-color: inherit;
background-color: inherit;
-moz-user-focus: ignore !important;
/* enable user input so that clicking on the control can bring up the
file dialog. It's still read-only. */
-moz-user-input: enabled;
color: inherit;
font-size: inherit;
height: inherit;
letter-spacing: inherit;
}
/* button part of file selector */
input[type="file"] > input[type="button"] {
height: inherit;
font-size: inherit;
letter-spacing: inherit;
}
/* radio buttons */
input[type="radio"] {
-moz-appearance: radio;
width: 13px;
height: 13px;
margin: 3px 3px 0px 5px;
padding: 0 !important;
cursor: default;
-moz-binding: none;
-moz-border-radius: 100% !important;
}
/* check boxes */
input[type="checkbox"] {
-moz-appearance: checkbox;
width: 13px;
height: 13px;
margin: 3px 3px 3px 4px;
padding: 0 !important;
vertical-align: text-bottom;
cursor: default;
-moz-binding: none;
-moz-border-radius: 0 !important;
}
/* common features of radio buttons and check boxes */
input[type="radio"],
input[type="checkbox"] {
/* same colors as |input| rule, but |!important| this time. */
-moz-box-sizing: border-box;
/*background-color: -moz-Field ! important;*/ /* *** phiw *** */
color: -moz-FieldText ! important;
/*border: 2px inset ThreeDFace ! important;*/ /* *** phiw *** */
}
input[type="radio"][disabled],
input[type="radio"][disabled]:active,
input[type="radio"][disabled]:hover,
input[type="radio"][disabled]:hover:active,
input[type="checkbox"][disabled],
input[type="checkbox"][disabled]:active,
input[type="checkbox"][disabled]:hover,
input[type="checkbox"][disabled]:hover:active {
padding: 1px;
/*border: 1px inset ThreeDShadow ! important;*/ /* *** phiw *** */
/* same as above, but !important */
/*color: GrayText ! important;*/ /* *** phiw *** */
/*background-color: ThreeDFace ! important;*/ /* *** phiw *** */
cursor: inherit;
}
input[type="checkbox"]:focus,
input[type="radio"]:focus {
/*border-style: groove !important;*/ /* *** phiw *** */
}
input[type="checkbox"]:hover:active,
input[type="radio"]:hover:active {
/*background-color: ThreeDFace ! important;
border-style: inset !important;*/ /* *** phiw *** */
}
*|*::-moz-radio {
width: 4px;
height: 4px;
/* background-color: -moz-FieldText ! important;*/ /* *** phiw *** */
-moz-border-radius: 3px;
}
/* buttons */
/* Note: Values in nsNativeTheme IsWidgetStyled function
need to match button background/border values here */
button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
-moz-appearance: button;
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here, for text inputs, and for <select>. For
buttons, make sure to include the -moz-focus-inner border/padding. */
padding: 0px 6px 0px 6px;
border: 2px outset ButtonFace;
background-color: ButtonFace;
color: ButtonText;
font: -moz-button;
line-height: normal !important;
white-space: pre;
cursor: default;
-moz-box-sizing: border-box;
-moz-user-select: none;
-moz-binding: none;
text-align:center;
}
button {
/* Buttons should lay out like "normal" html, mostly */
white-space: normal;
text-indent: 0;
}
*|*::-moz-button-content {
display: block;
}
button:active:hover,
input[type="reset"]:active:hover,
input[type="button"]:active:hover,
input[type="submit"]:active:hover {
padding: 0px 5px 0px 7px;
border-style: inset;
}
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
padding: 0px 2px 0px 2px;
border: 1px dotted transparent;
}
button:focus::-moz-focus-inner,
input[type="reset"]:focus::-moz-focus-inner,
input[type="button"]:focus::-moz-focus-inner,
input[type="submit"]:focus::-moz-focus-inner,
input[type="file"] > input[type="button"]:focus::-moz-focus-inner {
border-color: ButtonText;
}
button[disabled]:active, button[disabled],
input[type="reset"][disabled]:active,
input[type="reset"][disabled],
input[type="button"][disabled]:active,
input[type="button"][disabled],
select[disabled] > input[type="button"],
select[disabled] > input[type="button"]:active,
input[type="submit"][disabled]:active,
input[type="submit"][disabled] {
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here and for text inputs */
padding: 1px 7px 1px 7px;
border: 1px outset ButtonShadow;
color: GrayText;
cursor: inherit;
}
/*
* Make form controls inherit 'unicode-bidi' transparently as required by
* their various anonymous descendants and pseudo-elements:
*
* <textarea> and <input type="text">:
* inherit into the XULScroll frame with class 'anonymous-div' which is a
* child of the text control.
*
* Buttons (either <button>, <input type="submit">, <input type="button">
* or <input type="reset">)
* inherit into the ':-moz-button-content' pseudo-element.
*
* <select>:
* inherit into the ':-moz-display-comboboxcontrol-frame' pseudo-element and
* the <optgroup>'s ':before' pseudo-element, which is where the label of
* the <optgroup> gets displayed. The <option>s don't use anonymous boxes,
* so they need no special rules.
*/
textarea > .anonymous-div,
input > .anonymous-div,
*|*::-moz-button-content,
*|*::-moz-display-comboboxcontrol-frame,
optgroup:before {
unicode-bidi: inherit;
}
/*
* Force the text control child of file input controls to have left-to-right
* directionality. Otherwise filenames containing right-to-left characters
* will be reordered with chaotic results.
*/
input[type="file"] > input[type="text"] {
direction: ltr !important;
text-align: inherit;
}
@media print {
input, textarea, select, button {
-moz-user-input: none !important;
}
input[type="file"] { height: 2em; }
}
/* --------------------------------------------------------------------------
*
* modified by phiw - Philippe Wittenbergh. phiw@l-c-n.com emps.l-c-n.com
*
* -------------------------------------------------------------------------- */
/* --- Font Setting --- */
html select,
html input,
html input[type="submit"],
html input[type="reset"],
html input[type="password"],
html input[type="file"],
html input[type="text"],
html input:not([type]) {
font-size: small;
}
/* --- Color Setting --- */
html input[type="reset"],
html input[type="submit"],
html input[type="file"] {
color: #1e1e1e !important; /* soft black */
}
html input,
html textarea {
color: #1e1e1e;
}
html button,
html input[type="button"] {
color: ButtonText;
}
/* --- Input, textarea --- */
html input,
html input[type="text"],
html input[type="password"],
html textarea {
background-color: -moz-Field;
background-image: url("resource://gre/res/fields2a.png");
background-repeat: repeat-x;
background-position: 0 0;
-moz-border-radius: 0;
padding: 2px 0 2px 3px;
}
html input,
html textarea {
border-top: 1px solid #616365;
border-right: 1px solid #a0a3a5;
border-bottom: 1px solid #bbbdbf;
border-left: 1px solid #616365;
}
*[dir="rtl"] input[type="text"],
*[dir="rtl"] input[type="password"],
*[dir="rtl"] input:not([type]),
*[dir="rtl"] textarea {
padding: 2px 3px 2px 0;
}
html input[type="image"] {
border:none;
background-image:none;
padding:0;
}
/* --- Radio Buttons --- */
*|*::-moz-radio {
border: 0 none !important;
background-color: transparent !important;
}
html input[type="radio"] {
-moz-appearance: none;
width: 13px !important;
height: 13px !important;
margin: 3px 5px 0;
background: transparent url("resource://gre/res/radio.png") no-repeat center center !important;
vertical-align: baseline;
border: 0 none !important;
outline:none !important;
-moz-border-radius: 0 !important;
}
html input[type="radio"]:checked {
background: transparent url("resource://gre/res/radio_checked.png") no-repeat center center !important;
border: 0 none !important;
}
/* --- Check Boxes --- */
html input[type="checkbox"] {
width: 13px !important;
height:13px !important;
margin: 1px 2px 3px 3px;
vertical-align: text-bottom;
-moz-border-radius: 0 !important;
}
html input[type="checkbox"],
html input[type="checkbox"]:checked {
background: transparent url("resource://gre/res/checkbox.png") no-repeat center center ! important;
border: 0 none !important;
}
html input[type="radio"]:focus,
html input[type="checkbox"]:focus {
border: 0 none !important;
}
/* --- Buttons, Submit, Reset --- */
html input[type="reset"],
html input[type="submit"],
html input[type="file"] > input[type="button"] {
background: #efeded url("resource://gre/res/Buttons.png") repeat-x 50% 65% !important;
text-indent: 0 !important; /* beat those pesky ImageReplacement techniques */
padding: 1px 4px !important;
margin: 0;
border: 2px solid !important;
-moz-border-bottom-colors: #616365 #cecece;
-moz-border-left-colors: #797b7f #fff;
-moz-border-right-colors: #616365 #cecece;
-moz-border-top-colors: #797b7f #fff;
-moz-border-radius: 1px !important;
letter-spacing:0 !important
}
html input[type="reset"]:focus,
html input[type="submit"]:focus,
html input[type="reset"]:hover,
html input[type="submit"]:hover,
html input[type="reset"]:hover:active,
html input[type="submit"]:hover:active {
background-image: url("resource://gre/res/Buttons2.png") !important;
}
html button,
html input[type="button"],
html button[disabled],
html input[type="button"][disabled] { /* less strict, allows author styling */
background: #efeded url("resource://gre/res/Buttons.png") repeat-x 50% 65%;
text-indent: 0;
padding: 1px 4px;
margin: 0;
border: 2px solid;
-moz-border-bottom-colors: #616365 #cecece;
-moz-border-left-colors: #797b7f #e8e8e8;
-moz-border-right-colors: #616365 #cecece;
-moz-border-top-colors: #797b7f #e8e8e8;
letter-spacing:0;
-moz-border-radius: 1px;
}
html button:focus,
html input[type="button"]:focus,
html button:hover,
html input[type="button"]:hover,
html button:hover:active,
html input[type="button"]:hover:active {
background-image: url("resource://gre/res/Buttons2.png");
}
button[disabled]:active,
input[type="button"][disabled]:active {
padding: 1px 4px;
border: 2px solid;
}
/* kill dotted border on input[submit],etc -- leave it in for Linux, otherwise no feedback */
html button::-moz-focus-inner,
html input[type="reset"]::-moz-focus-inner,
html input[type="button"]::-moz-focus-inner,
html input[type="submit"]::-moz-focus-inner,
html input[type="file"] > input[type="button"]::-moz-focus-inner {
/*border-width:0 !important*/
}
/* --- input type=file --- */
html input[type="file"] {
background:transparent !important;
}
html input[type="file"] > input[type="text"] {
margin: 0 1px 0 0;
background-color: #fff !important;
}
html input[type="file"] > input[type="button"] {
margin: 0 1px !important;
}
/* --- Select Options --- */
*|*::-moz-display-comboboxcontrol-frame {
padding: 1px 4px;
}
*|*::-moz-dropdown-list {
border: none !important;
border-color:transparent !important;
background-color: #fff !important;
}
html select {
color: -moz-FieldText;
background: #fff ;
border: 1px solid #797b7f;
border-color: #797b7f #999 #999 #797b7f;
padding: 0;
direction: ltr;
}
*[dir="rtl"] select,
* select[dir="rtl"] {
direction: rtl;
}
html select[multiple],
html select[size],
html select[size][multiple] {
padding: 0;
}
html select:not([size]):not([multiple]),
html select[size="0"],
html select[size="1"] {
background: rgb(246, 246, 246) url("resource://gre/res/grad.png") repeat-x bottom right !important;
color: #2e2e2e !important;
height:auto !important;
border: 2px solid !important;
-moz-border-top-colors: #797b7f #fff;
-moz-border-right-colors: #616365 #cecece;
-moz-border-bottom-colors: #616365 #cecece;
-moz-border-left-colors: #797b7f #fff;
-moz-box-sizing: border-box !important;
-moz-border-radius: 1px !important;
padding:0 !important;
}
html select:not([size]):not([multiple]):focus,
html select[size="0"]:focus,
html select[size="1"]:focus,
html select:not([size]):not([multiple]):hover:active,
html select[size="0"]:hover:active,
html select[size="1"]:hover:active {
-moz-border-top-colors: #616365 #fff;
-moz-border-right-colors: #797b7f #cecece;
-moz-border-bottom-colors: #797b7f #cecece;
-moz-border-left-colors: #616365 #fff;
}
html optgroup,
html option {
background:transparent;
font-family:inherit;
font-size:inherit;
}
html optgroup:before {
font-style:normal;
font-weight:normal;
padding: 2px 5px 0 5px;
}
html select:not([size]):not([multiple]) optgroup:before,
html select[size="0"] optgroup:before,
html select[size="1"] optgroup:before {
color: #727272;
}
html select:not([size]):not([multiple]) option,
html select[size="0"] option,
html select[size="1"] option,
html select:not([size]):not([multiple]) optgroup,
html select[size="0"] optgroup,
html select[size="1"] optgroup {
background: transparent !important;
color: inherit !important;
}
html select:not([size]):not([multiple]) option:hover,
html select[size="0"] option:hover,
html select[size="1"] option:hover {
background-color: Highlight ! important;
color: HighlightText ! important;
}
html option:checked {
background-color: Highlight ! important;
color: HighlightText ! important;
}
html select > input[type="button"],
/*html select > input[type="button"]:focus,*/
html select > input[type="button"]:hover:active {
background-color: transparent !important;
background-image: url("resource://gre/res/droparrow.png") !important;
background-repeat: no-repeat !important;
background-position: 45% 50% !important;
outline: none;
margin: 0 !important;
border-width: 0 2px !important;
border-style: solid !important;
-moz-border-left-colors: #a3a3a3 transparent !important;
-moz-border-right-colors: transparent transparent !important;
padding: 0 6px !important;
}
*[dir="rtl"] select > input[type="button"],
*[dir="rtl"] select > input[type="button"]:hover:active,
select[dir="rtl"] > input[type="button"],
select[dir="rtl"] > input[type="button"]:hover:active {
-moz-border-right-colors: #a3a3a3 transparent !important;
-moz-border-left-colors: transparent transparent !important;
background-position: 60% 50% !important;
}
/* -- focus ring - mac specific code -- maybe use outline: 1px dotted invert for Linux ? -- disabled, this reverts to the default behaviour, I think. */
/*html button:focus,
button:focus:active,
html select:focus,
html input[type="reset"]:focus,
html input[type="button"]:focus,
html input[type="submit"]:focus,
html input[type="checkbox"]:focus,
html input[type="image"]:focus,
html input[type="text"]:focus,
html input:not([type]):focus,
html input[type="password"]:focus,
html textarea:focus {
outline-style: solid !important;
outline-width: 2px !important;
outline-color: -moz-mac-focusring !important;
outline-offset:0;
-moz-outline-radius:1px !important;
}*/
html input[type="reset"]:focus,
html input[type="submit"]:focus {
color:#262626 !important;
}
/*html select:focus {
outline-offset:-1px;
}
html input[type="radio"]:focus {
outline: 1.4pt solid -moz-mac-focusring !important;
outline-offset:-1px;
-moz-outline-radius:100% !important;
}*/
/*
*::-moz-focus-inner {
border-color: transparent !important;
border-width:0 !important
}
*/
/* --- disabled widgets --- */
html input[type="reset"][disabled],
html input[type="submit"][disabled],
html input[type="file"][disabled],
html select[disabled],
html select[disabled] option,
html option[disabled] {
color:#727272 !important;
}
html input[disabled],
html textarea[disabled],
html option[disabled],
html optgroup[disabled],
html select[disabled],
html select[disabled]>* {
-moz-user-input: disabled;
-moz-user-focus: ignore;
}
html select[disabled] > input[type="button"] {
border:none;
border-left:2px solid;
-moz-border-left-colors: #b3b3b3 transparent;
}
html option[disabled],
html optgroup[disabled] {
background-color: transparent;
}
html input[type="radio"][disabled],
html input[type="radio"][disabled]:active,
html input[type="radio"][disabled]:hover,
html input[type="radio"][disabled]:hover:active,
html input[type="checkbox"][disabled],
html input[type="checkbox"][disabled]:active,
html input[type="checkbox"][disabled]:hover,
html input[type="checkbox"][disabled]:hover:active {
border: 0 none !important;
background-color: transparent !important;
outline-width: 0 !important;
}
html select[disabled],
html input[disabled],
html textarea[disabled],
html button[disabled],
html input[type="checkbox"][disabled],
html input[type="radio"][disabled],
html input[type="button"][disabled],
html input[type="reset"][disabled],
html input[type="submit"][disabled] {
opacity: 0.6;
}
html input[type="file"][disabled] > * {
opacity:1.0 !important;
}RavN tu as l'air d'avoir trouvé comment régler le problème peut-tu m'expliquer?
PS: Par ailleurs question subsidiaire, comment faire la meme chose avec la liste de mail dans Thunderbird? je crois que c'est le widget input-box mais je ne sais pas du tout quoi modifier...
Merci de votre aide
Hors ligne
#59 Le 19/07/2007, à 13:27
- RavN
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Oula ça fait un moment ben oui j'avais ce problème et on m'avait donné un nouveau code qui fonctionnait. Mais au bout d'un moment je me suis rendu compte que y'avait d'autres problèmes d'affichage sur d'autres sites et donc j'ai tout enlevé.
Désolé !
Hors ligne
#60 Le 19/07/2007, à 20:46
- nanolight
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Ok merci, bon ba je vais rester comme ca et je verrai si ca va pas sur beaucoup de sites...
D'ailleurs c'est étonnant que les boutons des liens du wiki soient différents de ceux du forum ou du planet...
Hors ligne
#61 Le 01/08/2007, à 15:05
- lemerou
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Pour info, le bug "Sous linux, Firefox n'utilise pas les composants graphiques du theme courant" est corrigé 
https://bugs.launchpad.net/ubuntu/+sour … +bug/63242
https://bugzilla.mozilla.org/show_bug.cgi?id=329846
Maintenant peut être que le patch sera appliqué sur la version qui sortira avec Gutsy
Dernière modification par lemerou (Le 01/08/2007, à 15:06)
RAZIA: LA rAdio ÉtudiAnte de LAVAL (53) : http://www.radiorazia.com
Hors ligne
#62 Le 01/08/2007, à 15:15
- Compte anonymisé
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
lemerou a écrit :
Pour info, le bug "Sous linux, Firefox n'utilise pas les composants graphiques du theme courant" est corrigé
https://bugs.launchpad.net/ubuntu/+sour … +bug/63242
https://bugzilla.mozilla.org/show_bug.cgi?id=329846Maintenant peut être que le patch sera appliqué sur la version qui sortira avec Gutsy
Ca c'est une bonne nouvelle !
SDinon, il y a ça : http://ubuntuforums.org/showthread.php?t=369596
Dernière modification par Compte anonymisé (Le 01/08/2007, à 15:20)
#63 Le 02/08/2007, à 19:04
- Alain.g
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
shamanphenix a écrit :
SDinon, il y a ça : http://ubuntuforums.org/showthread.php?t=369596
En fait c'est la même chose que ce qui est donné au début de sujet (avec les mêmes défauts), c'est juste la méthode d'installation qui change
Xubuntu Karmic !
Hors ligne
#64 Le 03/08/2007, à 08:04
- Alain.g
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
lemerou a écrit :
Pour info, le bug "Sous linux, Firefox n'utilise pas les composants graphiques du theme courant" est corrigé
je viens d'essayer avec Firefox 3 alpha et effectivement, c'est corrigé.
Avec le thème par défaut d'Ubuntu :
google actu :
Dernière modification par Alain.g (Le 03/08/2007, à 08:06)
Xubuntu Karmic !
Hors ligne
#65 Le 03/08/2007, à 08:49
- Bismut
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Putain, génial ! Merci la MoFo ! Depuis le temps qu'on attendait ça ! 
Je leur pardonnerais presque le fait de ne pas utiliser XULRunner comme moteur pour Firefox...
Mac Mini 2009 avec Archlinux
Asus EeePC S101 avec Archlinux
HTC Magic avec Android
Hors ligne
#66 Le 03/08/2007, à 11:56
- Compte anonymisé
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Alain.g a écrit :
shamanphenix a écrit :SDinon, il y a ça : http://ubuntuforums.org/showthread.php?t=369596
En fait c'est la même chose que ce qui est donné au début de sujet (avec les mêmes défauts), c'est juste la méthode d'installation qui change
Oui, mais c'est plus sexy.
#67 Le 03/08/2007, à 12:37
- ®om
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
C'est abusé de mettre un truc aussi laid par défaut sous Firefox...
Hors ligne
#68 Le 26/10/2007, à 20:38
- dekans
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
regardez, il y a mieux !
http://www.kde-look.org/content/show.php/Firefox+Form+Widgets?content=64392
Avec les instructions d'installations en bas de la description.
C'est sur kde-look mais c'est indépendant de KDE, le style en est juste inspiré.
dekans@jabber.kubuntu-fr.org
Hors ligne
#69 Le 20/11/2007, à 12:56
- Levi59
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
personne pour répondre a l'edit 2?
J'ai essayé de trouver mais je trouve pas d'option claire... 
Hors ligne
#70 Le 20/11/2007, à 14:10
- Omnisilver
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Pour info, Firefox 3 sera mieux intégré sous linux : utilisation du thème GTK, boutons plus jolis, etc.
Edit : ah bah ça a déjà été dit 
Dernière modification par Omnisilver (Le 20/11/2007, à 14:12)
Hors ligne
#71 Le 20/11/2007, à 15:26
- atlas95
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Bonjour quelles sont les bonnes commande a excecuter pour que ca marche avec firefox 2.0.0.9 ?
Car j'ai essayer plusieurs tuto en restaurant le backup a chaque fois après et aucune ne fonctionne.
Merci d'avance
Ubuntu sur un XPS m1330:c'est ici !
Mon blog sur ubuntu:c'est ici !
Jabber : cyril at jabber.levis-heb.net
Hors ligne
#72 Le 20/11/2007, à 16:30
- Levi59
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Oui mais pour l'instant il y a pas de FF3 donc tant qu'on peux améliorer nous meme, autant le faire!
Atlas95:
J'ai modifiez mon form.css comme ca: (tu peux remplacer l'ensemble du tien avec celui la! ^^)
/* ***** BEGIN LICENSE BLOCK *****
* Version: MPL 1.1/GPL 2.0/LGPL 2.1
*
* The contents of this file are subject to the Mozilla Public License Version
* 1.1 (the "License"); you may not use this file except in compliance with
* the License. You may obtain a copy of the License at
* http://www.mozilla.org/MPL/
*
* Software distributed under the License is distributed on an "AS IS" basis,
* WITHOUT WARRANTY OF ANY KIND, either express or implied. See the License
* for the specific language governing rights and limitations under the
* License.
*
* The Original Code is mozilla.org code.
*
* The Initial Developer of the Original Code is
* Netscape Communications Corporation.
* Portions created by the Initial Developer are Copyright (C) 1998
* the Initial Developer. All Rights Reserved.
*
* Contributor(s):
*
* Alternatively, the contents of this file may be used under the terms of
* either of the GNU General Public License Version 2 or later (the "GPL"),
* or the GNU Lesser General Public License Version 2.1 or later (the "LGPL"),
* in which case the provisions of the GPL or the LGPL are applicable instead
* of those above. If you wish to allow use of your version of this file only
* under the terms of either the GPL or the LGPL, and not to allow others to
* use your version of this file under the terms of the MPL, indicate your
* decision by deleting the provisions above and replace them with the notice
* and other provisions required by the GPL or the LGPL. If you do not delete
* the provisions above, a recipient may use your version of this file under
* the terms of any one of the MPL, the GPL or the LGPL.
*
* ***** END LICENSE BLOCK ***** */
/**
Styles for old GFX form widgets
**/
@namespace url(http://www.w3.org/1999/xhtml); /* set default namespace to HTML */
@namespace xul url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);
*|*::-moz-fieldset-content {
display: block;
height: 100%; /* Need this so percentage heights of kids work right */
}
/* miscellaneous form elements */
legend {
padding-left: 2px;
padding-right: 2px;
border: none;
position: static ! important;
float: none ! important;
}
fieldset {
display: block;
margin-left: 2px;
margin-right: 2px;
padding: 0.35em 0.625em 0.75em;
border: 2px groove ThreeDFace;
}
label {
cursor: default;
}
/* default inputs, text inputs, and selects */
/* Note: Values in nsNativeTheme IsWidgetStyled function
need to match textfield background/border values here */
input {
-moz-appearance: textfield;
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here, for buttons, and for <select> (including its
internal padding magic) */
padding: 1px 0 1px 0;
border: 2px inset ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: -moz-field;
line-height: normal !important;
text-align: start;
text-transform: none;
word-spacing: normal;
letter-spacing: normal;
cursor: text;
-moz-binding: url("chrome://global/content/platformHTMLBindings.xml#inputFields");
text-indent: 0;
-moz-user-select: text;
}
input > .anonymous-div {
white-space : nowrap;
}
textarea {
margin: 1px 0 1px 0;
border: 2px inset ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: medium -moz-fixed;
text-align: start;
text-transform: none;
word-spacing: normal;
letter-spacing: normal;
vertical-align: text-bottom;
cursor: text;
-moz-binding: url("chrome://global/content/platformHTMLBindings.xml#textAreas");
-moz-appearance: textfield;
text-indent: 0;
-moz-user-select: text;
}
textarea > scrollbar {
cursor: default;
}
textarea > .anonymous-div,
input > .anonymous-div {
overflow: auto;
border: 0px !important;
padding: 0px;
margin: 0px;
/* XXXldb I'm not sure if we really want the 'text-decoration: inherit',
but it's needed to make 'text-decoration' "work" on text inputs. */
text-decoration: inherit;
}
select {
margin: 0;
border-color: ThreeDFace;
background-color: -moz-Field;
color: -moz-FieldText;
font: -moz-list;
line-height: normal !important;
white-space: nowrap !important;
text-align: start;
cursor: default;
-moz-box-sizing: border-box;
-moz-user-select: none;
-moz-appearance: menulist;
border-width: 2px;
border-style: inset;
text-indent: 0;
}
/* Need the "select[size][multiple]" selector to override the settings on
'select[size="1"]', eg if one has <select size="1" multiple> */
select[size],
select[multiple],
select[size][multiple] {
/* Different alignment and padding for listbox vs combobox */
vertical-align: text-bottom;
padding: 1px 0 1px 0;
-moz-appearance: listbox;
}
select[size="0"],
select[size="1"] {
/* Except this is not a listbox */
vertical-align: baseline;
padding: 0;
-moz-appearance: menulist;
}
select > input[type="button"] {
width: 12px;
height: 12px;
white-space: nowrap;
position: static !important;
background-image: url("arrow.gif") !important;
background-repeat: no-repeat !important;
background-position: center !important;
-moz-appearance: menulist-button;
}
select > input[type="button"]:active {
background-image: url("arrowd.gif") !important;
}
select::-moz-dummy-option {
visibility: hidden;
content: "XX"; /* demo 8, edge case test 1 */
}
*|*::-moz-display-comboboxcontrol-frame {
overflow: -moz-hidden-unscrollable;
/* This top/bottom padding plus the combobox top/bottom border need to
add up to the top/bottom borderpadding of text inputs and buttons */
padding-top: 1px;
padding-bottom: 1px;
-moz-padding-start: 4px;
-moz-padding-end: 0;
background-color: inherit;
color: inherit;
white-space: nowrap;
text-align: inherit;
-moz-user-select: none;
}
option {
display: block;
min-height: 1em;
line-height: normal !important;
-moz-user-select: none;
text-indent: 0;
}
select > option {
padding-top : 0;
padding-bottom: 0;
-moz-padding-start: 3px;
-moz-padding-end: 5px;
}
option:checked {
background-color: Highlight ! important;
color: HighlightText ! important;
}
optgroup {
display: block;
font: -moz-list;
line-height: normal !important;
font-style: italic;
font-weight: bold;
font-size: inherit;
-moz-user-select: none;
text-indent: 0;
}
optgroup > option {
padding-left: 20px;
font-style: normal;
font-weight: normal;
}
optgroup:before {
display: block;
content: attr(label);
}
*|*::-moz-dropdown-list {
z-index: 2147483647;
background-color: inherit;
-moz-user-select: none;
position: static !important;
float: none !important;
border: 1px outset black !important;
}
input[disabled],
textarea[disabled],
option[disabled],
optgroup[disabled],
select[disabled] {
-moz-user-input: disabled;
-moz-user-focus: ignore;
color: GrayText;
background-color: ThreeDFace;
cursor: inherit;
}
option[disabled],
optgroup[disabled] {
background-color: transparent;
}
/* hidden inputs */
input[type="hidden"] {
-moz-appearance: none;
display: none;
padding: 0;
border: 0;
cursor: auto;
-moz-user-focus: ignore;
-moz-binding: none;
}
/* image buttons */
input[type="image"] {
-moz-appearance: none;
padding: 0;
border: none;
background-color: transparent;
font-family: sans-serif;
font-size: small;
cursor: pointer;
-moz-binding: none;
-moz-appearance: none;
}
input[type="image"][disabled] {
cursor: inherit;
}
input[type="image"]:focus {
outline: 1px dotted invert;
}
/* file selector */
input[type="file"] {
-moz-appearance: none;
white-space: nowrap;
cursor: default;
-moz-binding: none;
padding: 0 !important;
border-style: none !important;
}
input[type="file"] > input[type="text"] {
border-color: inherit;
background-color: inherit;
color: inherit;
font-size: inherit;
height: inherit;
letter-spacing: inherit;
}
/* button part of file selector */
input[type="file"] > input[type="button"] {
height: inherit;
font-size: inherit;
letter-spacing: inherit;
}
/* radio buttons */
input[type="radio"] {
-moz-appearance: radio;
width: 13px;
height: 13px;
margin: 3px 3px 0px 5px;
padding: 0 !important;
cursor: default;
-moz-binding: none;
-moz-border-radius: 100% !important;
}
/* check boxes */
input[type="checkbox"] {
-moz-appearance: checkbox;
width: 13px;
height: 13px;
margin: 3px 3px 3px 4px;
padding: 0 !important;
vertical-align: text-bottom;
cursor: default;
-moz-binding: none;
-moz-border-radius: 0 !important;
}
/* common features of radio buttons and check boxes */
input[type="radio"],
input[type="checkbox"] {
/* same colors as |input| rule, but |!important| this time. */
-moz-box-sizing: border-box;
background-color: -moz-Field ! important;
color: -moz-FieldText ! important;
border: 2px inset ThreeDFace ! important;
}
input[type="radio"][disabled],
input[type="radio"][disabled]:active,
input[type="radio"][disabled]:hover,
input[type="radio"][disabled]:hover:active,
input[type="checkbox"][disabled],
input[type="checkbox"][disabled]:active,
input[type="checkbox"][disabled]:hover,
input[type="checkbox"][disabled]:hover:active {
padding: 1px;
border: 1px inset ThreeDShadow ! important;
/* same as above, but !important */
color: GrayText ! important;
background-color: ThreeDFace ! important;
cursor: inherit;
}
input[type="checkbox"]:focus,
input[type="radio"]:focus {
border-style: groove !important;
}
input[type="checkbox"]:hover:active,
input[type="radio"]:hover:active {
background-color: ThreeDFace ! important;
border-style: inset !important;
}
*|*::-moz-radio {
width: 4px;
height: 4px;
background-color: -moz-FieldText ! important;
-moz-border-radius: 3px;
}
/* buttons */
/* Note: Values in nsNativeTheme IsWidgetStyled function
need to match button background/border values here */
button,
input[type="reset"],
input[type="button"],
input[type="submit"] {
-moz-appearance: button;
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here, for text inputs, and for <select>. For
buttons, make sure to include the -moz-focus-inner border/padding. */
padding: 0px 6px 0px 6px;
border: 2px outset ButtonFace;
background-color: ButtonFace;
color: ButtonText;
font: -moz-button;
line-height: normal !important;
white-space: pre;
cursor: default;
-moz-box-sizing: border-box;
-moz-user-select: none;
-moz-binding: none;
text-align: center;
}
button {
/* Buttons should lay out like "normal" html, mostly */
white-space: normal;
text-indent: 0;
}
*|*::-moz-button-content {
display: block;
}
button:active:hover,
input[type="reset"]:active:hover,
input[type="button"]:active:hover,
input[type="submit"]:active:hover {
padding: 0px 5px 0px 7px;
border-style: inset;
}
button::-moz-focus-inner,
input[type="reset"]::-moz-focus-inner,
input[type="button"]::-moz-focus-inner,
input[type="submit"]::-moz-focus-inner,
input[type="file"] > input[type="button"]::-moz-focus-inner {
padding: 0px 2px 0px 2px;
border: 1px dotted transparent;
}
button:focus::-moz-focus-inner,
input[type="reset"]:focus::-moz-focus-inner,
input[type="button"]:focus::-moz-focus-inner,
input[type="submit"]:focus::-moz-focus-inner,
input[type="file"] > input[type="button"]:focus::-moz-focus-inner {
border-color: ButtonText;
}
button[disabled]:active, button[disabled],
input[type="reset"][disabled]:active,
input[type="reset"][disabled],
input[type="button"][disabled]:active,
input[type="button"][disabled],
select[disabled] > input[type="button"],
select[disabled] > input[type="button"]:active,
input[type="submit"][disabled]:active,
input[type="submit"][disabled] {
/* The sum of border-top, border-bottom, padding-top, padding-bottom
must be the same here and for text inputs */
padding: 1px 7px 1px 7px;
border: 1px outset ButtonShadow;
color: GrayText;
cursor: inherit;
}
/*
* Make form controls inherit 'unicode-bidi' transparently as required by
* their various anonymous descendants and pseudo-elements:
*
* <textarea> and <input type="text">:
* inherit into the XULScroll frame with class 'anonymous-div' which is a
* child of the text control.
*
* Buttons (either <button>, <input type="submit">, <input type="button">
* or <input type="reset">)
* inherit into the ':-moz-button-content' pseudo-element.
*
* <select>:
* inherit into the ':-moz-display-comboboxcontrol-frame' pseudo-element and
* the <optgroup>'s ':before' pseudo-element, which is where the label of
* the <optgroup> gets displayed. The <option>s don't use anonymous boxes,
* so they need no special rules.
*/
textarea > .anonymous-div,
input > .anonymous-div,
*|*::-moz-button-content,
*|*::-moz-display-comboboxcontrol-frame,
optgroup:before {
unicode-bidi: inherit;
}
/*
* Force the text control child of file input controls to have left-to-right
* directionality. Otherwise filenames containing right-to-left characters
* will be reordered with chaotic results.
*/
input[type="file"] > input[type="text"] {
direction: ltr !important;
text-align: inherit;
}
@media print {
input, textarea, select, button {
-moz-user-input: none !important;
}
input[type="file"] { height: 2em; }
}
/* AJOUTE PAR MOI */
/* Radio buttons */
input[type="radio"] {
width: 13px;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAABE5AAAROQEb2ZNGAAAAB3RJTUUH1AoPBic2RlqnIAAAAB10RVh0Q29tbWVudABDcmVhdGVkIHdpdGggVGhlIEdJTVDvZCVuAAABTUlEQVR42n3QP2sTARyH8c%2F9aVNSOugRFURaoZObm4PvwBcg7Sri1sX3kM28iOwqwbWYycGEYukiwgXkhsA1moYIqXp3ORfFiiHP%2Fvx4vr%2FAv9zCHhI08D2KnFdV%2FJnyixXcxxGOMUGFMV6GHMax%2FVXCCxTtdrtO07QuiqIejUZVp9OZ4SQMPbXhztWkIxT9fr9exWAwmAWC13iIJjzAcbvdrtfR7XbPosizrS0teIRJmqZrpTzPZ3iu2bwZ%2Fv7S9d3dXetIkmQniMNLi0UZEi2QZ1m2XCfN5%2FNpXS2%2F4kcoqs7xrtfrfVsnnZ5%2BeK82xk%2FiOMFjnAyHw4tVe7Is%2BxgKD3ED0Z9DdwOeCIJX3W73LM%2FzWVmW1XQ6nfTf9t%2FgAPvYgOBvwObtWLVXBst7ajvUl0JTy2hM9QkXKP4PbzSaSLZp4VpLaxubV5PgFxDO36GrPHeyAAAAAElFTkSuQmCC") no-repeat center !important;
border: none !important;
background-color: inherit !important;
}
input[type="radio"]:focus:not([class]):not([id]):not([style]),
input[type="radio"]:focus,
input[type="radio"]:active:focus,
input[type="radio"][disabled],
input[type="radio"][disabled]:hover {
border:none !important;
}
input[type="radio"]:checked {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAABE5AAAROQEb2ZNGAAAAB3RJTUUH1QsZFzQH6MHdmQAAAB10RVh0Q29tbWVudABDcmVhdGVkIHdpdGggVGhlIEdJTVDvZCVuAAABn0lEQVQoz32Sv4vTYByHnzfJ3Xs0OEitFUQ46S21k04GTkjn224RbxURHO6fELKZqX%2BABDdRBx3PZm%2B45aAEQwqS4aA9zdVC%2FUHy9usgcorFZ%2F%2FA55fib64B20AT0MB322ZmjPMR6k%2Bs4TZwCBwBZ4ABToFXFhw4DjvrBM%2BAKggCyfNcqqqSyWRiwjCcA8eWxSM2uPGnpUOgiuNY1jEajeYK9QbYBRoAd4GjIAhERCTLMvF9X7TW4vu%2BZFkmIiJRFJ3YNo%2B3tmgpYA94nuf5lU6nQ7%2Ffp9fr0e12SdOU8XhMHMfMZrMv7Xb7KY3GC4B9wFRVJSIiWmsZDAbi%2B764ritaaxERqevaKMd6AjQtsL8C06IoVgCe55GmKUmSsFwu8TwPgMViUYpZfQZ%2BgM0d4GUYhvP%2FZRoO378D7gGb4DhN4D5wnCTJ%2Bbr2iqJILawD4Cpg%2F679poKHKPU6iqKT6XQ6r%2BvalGV5Fg%2Fjt8ADYAfYAFAX%2B25edzDbtVrdQrgE8g2LkpV9CuYDcA5U%2Fx5J6wbQdKEFXG7Rcn9luLAE8BNb3%2FD89tWhJgAAAABJRU5ErkJggg%3D%3D") !important;
}
*::-moz-radio {
border: none !important;
background-color: transparent !important;
}
/* Checkboxes */
input[type="checkbox"]:disabled {
border: none !important;
background-color: transparent !important;
}
input[type="checkbox"] {
width: 12px;
height: 12px;
border-width: 0 !important;
background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH1AgMECE6aWhvwQAAADlJREFUeNpjZGBgsGRgYFBiIBKwQBXvJlI9GwsS5zUh1f%2F%2F%2F%2F%2FHxEAiGNVAEw2wiGP7%2F%2F%2F%2FP2I0AAAC1gpD9bqgwgAAAABJRU5ErkJggg%3D%3D") no-repeat center !important;
background-color: -moz-Field !important;
}
input[type="checkbox"]:checked {
background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAABmJLR0QA%2FwD%2FAP%2BgvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH1QwMBQERdGGm3QAAAJ1JREFUKM%2BN0TFqQkEUheFv5CVLsLHLBlK7ltekEMRCSFIklumDvWQX1u7Nk2YeTMToDAzM4Z7%2FXu6cgiWedJ6hmk%2Bd%2FkcYMUe5cb9QkmTW0fUHn5O4B%2ByxqlP%2BAA%2F4uDAf8IZg1xZGLGrhtXb7rjp4mXZJkksgODbvTbt8C8yxbYznqsstoOC9mtfXvvcaUPD8Xx5JMkwJJjn3RP0Lq9s0z9fV%2B5QAAAAASUVORK5CYII%3D") !important;
}Je cree un fichier sur le bureau que je nomme form.css et j'update celui de firefox avec cette commande (j'ai au préalable faire un backup du fichier):
cp -u /home/LOGINSESSION/Bureau/form.css /usr/lib/firefox/res/forms.cssVoici un effet de la modification...
avant 
après 
Dernière modification par Levi59 (Le 20/11/2007, à 16:55)
Hors ligne
#73 Le 20/11/2007, à 16:57
- Levi59
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Les cases initiative apparaitraient de la même façon sans modif...
Hors ligne
#74 Le 28/04/2008, à 10:27
- damb
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Existe t il une astuce identique pour ff3...?
Hors ligne
#75 Le 28/04/2008, à 11:09
- Bismut
Re : Firefox (css) boutons radios, input et textarea plus jolis par défaut
Astuce obsolète car FF 3 gère beaucoup mieux son intégration GTK donc le thème est repris pour les éléments de pages web.
Mais si tu veux tout de même skinner toi-même tes éléments, ben ça doit toujours être possible, ce n'est que du CSS
Mac Mini 2009 avec Archlinux
Asus EeePC S101 avec Archlinux
HTC Magic avec Android
Hors ligne