Style des input contenu dans un Fieldset

Version imprimable

Bonjour,

je souhaiterai savoir s'il était possible d’appliquer un style au balise input contenu dans un fieldset sans avoir à créer une nouvelle class.

J'aimerais faire quelque chose dans ce style:

Code:

1
2
3
4
5
6
7
8
9
10
fieldset.input
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #fff;
	border: 1px solid #990000;
	color: #333333;
 
}

plutôt que de devoir faire ça:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
.InputDansFieldset
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #fff;
	border: 1px solid #990000;
	color: #333333;  
}
 
<fieldset>
<input type="text" class="InputDansFieldset"   name="Text"/>
</fieldset>

C'est possible?

Merci d'avance.

Bonjour,

Tu n'étais pas loin :

Code:

1
2
3
4
5
6
7
8
9
10
fieldset input
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #fff;
	border: 1px solid #990000;
	color: #333333;
 
}

Bien sur c'est possible, cependant je ne peux pas te répondre precisement tant que je ne connais pas ton DOM.
En partant du princinpe que tu n'as qu'un seul fieldset, ceci devrait suffire:
Code:

1 2 3 4 5 6 7 8 9 10 11 fieldset input { -moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/ -webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/ border-radius: 4px 4px 4px 4px; background-color: #fff; border: 1px solid #990000; color: #333333; }
En effet , en css , toute les balises sont selectionnable en ecrivant seulement leur nom.

Merci cela fonctionne.

Encore une petite chose, est ce que je peux simplifier ça :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
fieldset input
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #FFFFEA;
	border: 1px solid #990000;
	color: #333333;
 
}
 
fieldset textarea
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #FFFFEA;
	border: 1px solid #990000;
	color: #333333;
 
}
 
fieldset select{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #FFFFEA;
	border: 1px solid #990000;
	color: #333333;
 
}

en quelque chose comme ça:

Code:

1
2
3
4
5
6
7
8
9
10
11
 
fieldset input,textearea,select
{
	-moz-border-radius: 4px 4px 4px 4px; /*coins arrondis FireFox*/
	-webkit-border-radius:4px 4px 4px 4px;/*coins arrondis Chrome*/
	border-radius: 4px 4px 4px 4px;
	background-color: #FFFFEA;
	border: 1px solid #990000;
	color: #333333;
 
}

16/05/2011, 18h12
vaneck

Non.

fieldset input,textearea,select ==> signifie "selectionne input dans fieldset + tous les textarea + tous les select". Bon , visuellement , ca peut marcher , mais pour plus de securité il vaut mieux ecrire:
fieldset input,fieldset textearea, fieldset select
Ou à la rigueur , si tu n'as que ces 3 élément dans ton fieldset:
fieldset *

si tu veux simplifier encore plus, tu peux également simplifier le border-radius :
Code:

1 2 3 -moz-border-radius: 4px; /*coins arrondis FireFox*/ -webkit-border-radius:4px;/*coins arrondis Chrome*/ border-radius: 4px;

16/05/2011, 22h19
vaneck

ornitho13 si tu le prend comme :D ca, on peut aussi se contenter d'un :
border-radius: 4px;
En effet, ff4 comme le dernier chrome n'ont plus besoin d'extension proprio!
16/05/2011, 22h20
ornitho13

oui c'est vrai :) ! tu as bien raison !
17/05/2011, 08h35
crazyyann

Je vous remercie pour toute ces précisions.