[CSS] Classi

03-10-2009, 01.31.03

Salve ragazzi oggi mi sono sbirarrito a creare un css per un form, ma il fatto è che non so come farlo andare! in poche parole io vorrei farlo divnetare una classe e attraverso l'attrituo class richiamarlo per formattare la pagina! qualcuno mi aiuta cortesemente ecco il codice:

CODICE

**andreafallico** · 03-10-2009, 02.34.11

Veramente in qel file non vedo nessuna classe in css;
le classi sono formate in questo modo:

Codice:

.nomeclasse{
...
...
}

Prima leggi queste guide:
Id e classi: due selettori speciali
Classi CSS

03-10-2009, 19.03.09

ho provato cosi!

Codice PHP:


.color{


body {
font:12px/17px Arial, 
Helvetica, 
sans-serif; 
color:#333; 
background:#ccc; 
padding:40px 20px 20px 20px;
}

imput.text {
font: bold 12px Arial, Helvetica, sans-serif;
color: #000000;
 background:url(img/input.png) repeat-x 0 0;
border: 2px solid #000000;
padding-right: 3px;
padding-left: 3px;
padding-top: 3px;
width: 140px;
height: 15px;
-moz-border-radius: 2em 2em;
-webkit-border-radius: 2em;
}

fieldset {
background:#F4F4F4; 
padding:10px; 
border:1px solid #fff; 
border-color:#fff #666661 #666661 #fff; 
margin-bottom:36px; 
width:600px;
}

legend {
background:#4C5CBD; 
color:#F8971D; 
font:17px/21px Calibri, Arial, Helvetica, sans-serif; 
padding:0 10px; margin:-26px 0 0 -11px; 
font-weight:bold; 
border:1px solid #fff;
border-color:#e5e5c3 #505014 #505014 #e5e5c3;}

text.label {
font-size:11px; 
font-weight:bold; 
color:#666;
}

label.opt {
font-weight:normal;
}

dl {
clear:both;
}

dt {
float:left;
 text-align:right; 
width:90px;
 line-height:25px;
 margin:0 10px 10px 0;
}

dd {
float:left;
 width:475px; 
line-height:25px; 
margin:0 0 10px 0;
}
}

e lo richiamato nell html con l'attributo class ma non funziona io non vedo niente formattato!

**miki92** · 03-10-2009, 19.07.28

Potresti mostrare il codice HTML o un link alla pagina a cui applichi questo stile?

03-10-2009, 19.11.49

prova cosi...

Codice PHP:


text.body {
font : 12px/17px Arial, Helvetica, sans-serif;
color : #333;
background : #ccc;
padding : 40px 20px 20px 20px;
}
text.text {
font : bold 12px Arial, Helvetica, sans-serif;
color : #000000;
background : url(img/input.png) repeat-x 0 0;
border : 2px solid #000000;
padding-right : 3px;
padding-left : 3px;
padding-top : 3px;
width : 140px;
height : 15px;
}
text.fieldset {
background : #f4f4f4;
padding : 10px;
border : 1px solid #fff;
border-color : #fff #666661 #666661 #fff;
margin-bottom : 36px;
width : 600px;
}
text.legend {
background : #4c5cbd;
color : #f8971d;
font : 17px/21px Calibri, Arial, Helvetica, sans-serif;
padding : 0 10px;
margin : -26px 0 0 -11px;
font-weight : bold;
border : 1px solid #fff;
border-color : #e5e5c3 #505014 #505014 #e5e5c3;
}
text.label {
font-size : 11px;
font-weight : bold;
color : #666;
}
text.label.opt {
font-weight : normal;
}
text.dl {
clear : both;
}
text.dt {
float : left;
text-align : right;
width : 90px;
line-height : 25px;
margin : 0 10px 10px 0;
}
text.dd {
float : left;
width : 475px;
line-height : 25px;
margin : 0 0 10px 0;
}

03-10-2009, 19.12.19

Codice PHP:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Crea il tuo blog con Zomer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="all" href="http://zomer.altervista.org/stili/form/stile.css" />
</head>
<body><div id="container">
<form action='save.php' method='get' class="color">
    <fieldset>
        <legend>TITOLO</legend>
        <dl>
            <dt><label for="form1">form1:</label></dt>
            <dd><input name="form1" type="text"></dd>
        </dl>
      //qui tutto il form
<center>
<input id="submit" name="submit" value"invio">
</center>
</fieldset>
</form>
</div>
</body>
</html>

03-10-2009, 19.14.07

hai provato come ti ho detto io....
ma text.body e la class di qualche span o div o pensi che sia body come html se e cosi

si scrive cosi
body{
......
......
}
senza text.body

**acsocmel** · 03-10-2009, 19.24.35

puoi rispiegare cosa vuoi fare?
in ogni caso non esiste un tag chiamato text quindi correggi

**andreafallico** · 03-10-2009, 19.27.38

Ma se tu scrivi direttamente in questo modo:

Codice:

body {
font:12px/17px Arial, 
Helvetica, 
sans-serif; 
color:#333; 
background:#ccc; 
padding:40px 20px 20px 20px;
}

input{
font: bold 12px Arial, Helvetica, sans-serif;
color: #000000;
 background:url(img/input.png) repeat-x 0 0;
border: 2px solid #000000;
padding-right: 3px;
padding-left: 3px;
padding-top: 3px;
width: 140px;
height: 15px;
-moz-border-radius: 2em 2em;
-webkit-border-radius: 2em;
}

fieldset {
background:#F4F4F4; 
padding:10px; 
border:1px solid #fff; 
border-color:#fff #666661 #666661 #fff; 
margin-bottom:36px; 
width:600px;
}

legend {
background:#4C5CBD; 
color:#F8971D; 
font:17px/21px Calibri, Arial, Helvetica, sans-serif; 
padding:0 10px; margin:-26px 0 0 -11px; 
font-weight:bold; 
border:1px solid #fff;
border-color:#e5e5c3 #505014 #505014 #e5e5c3;}

label {
font-size:11px; 
font-weight:bold; 
color:#666;
}

label.opt {
font-weight:normal;
}

dl {
clear:both;
}

dt {
float:left;
 text-align:right; 
width:90px;
 line-height:25px;
 margin:0 10px 10px 0;
}

dd {
float:left;
 width:475px; 
line-height:25px; 
margin:0 0 10px 0;
}

non c'è bisogno di usare l'attributo class
poi inoltre <div id="container"> container non è definito in nessuna parte

Codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Crea il tuo blog con Zomer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="all" href="http://zomer.altervista.org/stili/form/stile.css" />
</head>
<body><div id="container">
<form action='save.php' method='get'>
    <fieldset>
        <legend>TITOLO</legend>
        <dl>
            <dt><label for="form1">form1:</label></dt>
            <dd><input name="form1" type="text"></dd>
        </dl>
      //qui tutto il form
<center>
<input id="submit" name="submit" value"invio">
</center>
</fieldset>
</form>
</div>
</body>
</html>

03-10-2009, 19.35.30

Originalmente inviato da hotmailpower

hai provato come ti ho detto io....
ma text.body e la class di qualche span o div o pensi che sia body come html se e cosi

si scrive cosi
body{
......
......
}
senza text.body

Non c'entra niente. text.body indicherebbe un elemento che ha due classi:

Codice HTML:

<div class="text body">

I tag invece sono senza punto davanti, quindi sarebbe dovuto essere:

Codice:

.text body {

}

Sarebbe stato un errore però perchè il tag body non è contenuto se non in html.

03-10-2009, 20.15.25

Originalmente inviato da andreafallico

Ma se tu scrivi direttamente in questo modo:

Codice:

body {
font:12px/17px Arial, 
Helvetica, 
sans-serif; 
color:#333; 
background:#ccc; 
padding:40px 20px 20px 20px;
}

input{
font: bold 12px Arial, Helvetica, sans-serif;
color: #000000;
 background:url(img/input.png) repeat-x 0 0;
border: 2px solid #000000;
padding-right: 3px;
padding-left: 3px;
padding-top: 3px;
width: 140px;
height: 15px;
-moz-border-radius: 2em 2em;
-webkit-border-radius: 2em;
}

fieldset {
background:#F4F4F4; 
padding:10px; 
border:1px solid #fff; 
border-color:#fff #666661 #666661 #fff; 
margin-bottom:36px; 
width:600px;
}

legend {
background:#4C5CBD; 
color:#F8971D; 
font:17px/21px Calibri, Arial, Helvetica, sans-serif; 
padding:0 10px; margin:-26px 0 0 -11px; 
font-weight:bold; 
border:1px solid #fff;
border-color:#e5e5c3 #505014 #505014 #e5e5c3;}

label {
font-size:11px; 
font-weight:bold; 
color:#666;
}

label.opt {
font-weight:normal;
}

dl {
clear:both;
}

dt {
float:left;
 text-align:right; 
width:90px;
 line-height:25px;
 margin:0 10px 10px 0;
}

dd {
float:left;
 width:475px; 
line-height:25px; 
margin:0 0 10px 0;
}

non c'è bisogno di usare l'attributo class
poi inoltre <div id="container"> container non è definito in nessuna parte

Codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Crea il tuo blog con Zomer</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" media="all" href="http://zomer.altervista.org/stili/form/stile.css" />
</head>
<body><div id="container">
<form action='save.php' method='get'>
    <fieldset>
        <legend>TITOLO</legend>
        <dl>
            <dt><label for="form1">form1:</label></dt>
            <dd><input name="form1" type="text"></dd>
        </dl>
      //qui tutto il form
<center>
<input id="submit" name="submit" value"invio">
</center>
</fieldset>
</form>
</div>
</body>
</html>

e come fa a riconoscere i tag e a darli gli stili? ad esmpio come fa a capire che al tag <legend> va applicato un certo stile?

@biccheddu

Non ho cpaito bene cosa vuoi dire...

dovrei fare cosi?

Codice PHP:


.text body {

font:12px/17px Arial, 

Helvetica, 

sans-serif; 

color:#333; 

background:#ccc; 

padding:40px 20px 20px 20px;

}



.text input{

font: bold 12px Arial, Helvetica, sans-serif;

color: #000000;

 background:url(img/input.png) repeat-x 0 0;

border: 2px solid #000000;

padding-right: 3px;

padding-left: 3px;

padding-top: 3px;

width: 140px;

height: 15px;

-moz-border-radius: 2em 2em;

-webkit-border-radius: 2em;

}



.text fieldset {

background:#F4F4F4; 

padding:10px; 

border:1px solid #fff; 

border-color:#fff #666661 #666661 #fff; 

margin-bottom:36px; 

width:600px;

}



.text legend {

background:#4C5CBD; 

color:#F8971D; 

font:17px/21px Calibri, Arial, Helvetica, sans-serif; 

padding:0 10px; margin:-26px 0 0 -11px; 

font-weight:bold; 

border:1px solid #fff;

border-color:#e5e5c3 #505014 #505014 #e5e5c3;}



.text label {

font-size:11px; 

font-weight:bold; 

color:#666;

}



.text label.opt {

font-weight:normal;

}



.text dl {

clear:both;

}



.text dt {

float:left;

 text-align:right; 

width:90px;

 line-height:25px;

 margin:0 10px 10px 0;

}



.text dd {

float:left;

 width:475px; 

line-height:25px; 

margin:0 0 10px 0;

}

e creare un div cosi

Codice PHP:


<div class="text body">

03-10-2009, 20.18.21

No zomer, era un commento per hotmailpower.

Andrefallico, gli id sono come degli anchor negli url, non servono solo per epoter essere "formattati" dal CSS. Hanno la stessa proprietà di name="", solo che quest'ultimo è solo per i anchor link (<a>).

Potresti postare un link esemplificativo? Dovrei creare due file quando si può lavorare benissimo con la pagina online...

03-10-2009, 20.26.02

LINK ecco il link della pagina ora sono riuscito a mettere lo stile nella apgina ma non vedo niente per gli imput, ho applicato anche a loro uno stile...

03-10-2009, 20.28.42

@biccheddu
io pensavo che lui aveva creato dei div o aveva usato qualche tabella...

poi ho scritto se lui non stava usando qualche cosa di questi due
come nella tag body come avevo scritto che si stava confondendo... ^^

prova cosi

Codice PHP:


body {

font:12px/17px Arial, 

Helvetica, 

sans-serif; 

color:#333; 

background:#ccc; 

padding:40px 20px 20px 20px;

}



text {

font: bold 12px Arial, Helvetica, sans-serif;

color: #000000;

 background:url(img/input.png) repeat-x 0 0;

border: 2px solid #000000;

padding-right: 3px;

padding-left: 3px;

padding-top: 3px;

width: 140px;

height: 15px;

-moz-border-radius: 2em 2em;

-webkit-border-radius: 2em;

}



fieldset {

background:#F4F4F4; 

padding:10px; 

border:1px solid #fff; 

border-color:#fff #666661 #666661 #fff; 

margin-bottom:36px; 

width:600px;

}



legend {

background:#4C5CBD; 

color:#F8971D; 

font:17px/21px Calibri, Arial, Helvetica, sans-serif; 

padding:0 10px; margin:-26px 0 0 -11px; 

font-weight:bold; 

border:1px solid #fff;

border-color:#e5e5c3 #505014 #505014 #e5e5c3;

}



text.label {

font-size:11px; 

font-weight:bold; 

color:#666;

}



label.opt {

font-weight:normal;

}



dl {

clear:both;

}



dt {

float:left;

 text-align:right; 

width:90px;

 line-height:25px;

 margin:0 10px 10px 0;

}



dd {

float:left;

width:475px; 

line-height:25px; 

margin:0 0 10px 0;

}

03-10-2009, 20.29.07

In ogni caso c'è una } di più alla fine del file. Usa questo e riaggiungi il moz-border-radius:

Codice:

body {
font : 12px/17px Arial, Helvetica, sans-serif;
color : #333;
background : #ccc;
padding : 40px 20px 20px 20px;
}
text {
font : bold 12px Arial, Helvetica, sans-serif;
color : #000000;
background : url(img/input.png) repeat-x 0 0;
border : 2px solid #000000;
padding-right : 3px;
padding-left : 3px;
padding-top : 3px;
width : 140px;
height : 15px;
}
fieldset {
background : #f4f4f4;
padding : 10px;
border : 1px solid #fff;
border-color : #fff #666661 #666661 #fff;
margin-bottom : 36px;
width : 600px;
}
legend {
background : #4c5cbd;
color : #f8971d;
font : 17px/21px Calibri, Arial, Helvetica, sans-serif;
padding : 0 10px;
margin : -26px 0 0 -11px;
font-weight : bold;
border : 1px solid #fff;
border-color : #e5e5c3 #505014 #505014 #e5e5c3;
}
text.label {
font-size : 11px;
font-weight : bold;
color : #666;
}
label.opt {
font-weight : normal;
}
dl {
clear : both;
}
dt {
float : left;
text-align : right;
width : 90px;
line-height : 25px;
margin : 0 10px 10px 0;
}
dd {
float : left;
width : 475px;
line-height : 25px;
margin : 0 0 10px 0;
}

**andreafallico** · 03-10-2009, 20.29.49

devi sostituire quello che hai scritto tu con questo

Codice:

body {
font:12px/17px Arial, 
Helvetica, 
sans-serif; 
color:#333; 
background:#ccc; 
padding:40px 20px 20px 20px;
}

input{
font: bold 12px Arial, Helvetica, sans-serif;
color: #000000;
 background:url(img/input.png) repeat-x 0 0;
border: 2px solid #000000;
padding-right: 3px;
padding-left: 3px;
padding-top: 3px;
width: 140px;
height: 15px;
-moz-border-radius: 2em 2em;
-webkit-border-radius: 2em;
}

fieldset {
background:#F4F4F4; 
padding:10px; 
border:1px solid #fff; 
border-color:#fff #666661 #666661 #fff; 
margin-bottom:36px; 
width:600px;
}

legend {
background:#4C5CBD; 
color:#F8971D; 
font:17px/21px Calibri, Arial, Helvetica, sans-serif; 
padding:0 10px; margin:-26px 0 0 -11px; 
font-weight:bold; 
border:1px solid #fff;
border-color:#e5e5c3 #505014 #505014 #e5e5c3;}

label {
font-size:11px; 
font-weight:bold; 
color:#666;
}

label.opt {
font-weight:normal;
}

dl {
clear:both;
}

dt {
float:left;
 text-align:right; 
width:90px;
 line-height:25px;
 margin:0 10px 10px 0;
}

dd {
float:left;
 width:475px; 
line-height:25px; 
margin:0 0 10px 0;
}

03-10-2009, 22.03.30

Inanzi tutto grazie a tutti!

Vi volevo dire che cosi lo script non và, poiche mi modifcia tutti gli imput anche il sumbit, come potete constatare qui LINK voi cosa mi condigliate di fare?

in poche parole gli imput tex devono avere un loro stile le selection list devono avere un loro stile...ad esempio questo

.Select {height:21px; position:absolute; border:1px solid transparent;}
SelectLeft {float:left; width:3px; height:21px; background:url(img/select-left.png) no-repeat 0 0; vertical-align:middle;}
.SelectRight {height:21px; width:auto; background:url(img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#fff; padding-left:3px; margin-left:3px;}
.SelectTarget {position:absolute; background:none; margin-left:-13px; margin-top:18px; z-index:3; left:0; top:0; padding-bottom:13px;}
.SelectOptions {position:relative; background:#707175; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; color:#fff; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;}
.SelectOptions li {padding-bottom:1px;}
.SelectOptions a {display:block; text-decoration:none; color:#fff; padding:2px 3px; background:none;}
.SelectOptions a.NFOptionActive {background:#464646;}
.SelectOptions a:hover {background:#333;}

03-10-2009, 22.17.11

Se vuoi modificarne usa appunto le classi:
input.nome_classe

03-10-2009, 22.25.18

quindi creare un altro folgio stile e mttere dentro questo codice:

Codice PHP:


input.testo{
font: bold 12px Arial, Helvetica, sans-serif;
color: #000000;
 background:url(img/input.png) repeat-x 0 0;
border: 2px solid #000000;
padding-right: 3px;
padding-left: 3px;
padding-top: 3px;
width: 140px;
height: 15px;
-moz-border-radius: 2em 2em;
-webkit-border-radius: 2em;
}

03-10-2009, 22.27.57

Perchè? Metti nello stesso file.

Guarda questa pagina: http://www.cssplay.co.uk/menu/form (è un forma esclusivamente con CSS)

Salvala, studiati bene il sorgente poi se c'è qualcosa che non capisci riscrivi qui.

**andreafallico** · 03-10-2009, 22.45.47

Non c'è bisogno che crei un altro file;
invece nel tuo file
dove c'è input lo devi modificare come hai detto sopra in input.text

03-10-2009, 23.26.54

E dopo come lo richiamo class="text" cosi và bene? oppure class="imput.text"

**andreafallico** · 03-10-2009, 23.36.18

Ho visto il sorgente (creazione_blog.php) e già è tutto apposto infatti guarda:

Codice:

<dt><label for="titolo">Titolo:</label></dt>
            <dd><input name="nome" type="text" class="text"></dd>
        </dl>
        <dl>
            <dt><label for="sottotitolo">Sottotiolo</label></dt>
            <dd><input name="sottotitolo" type="text" class="text"></dd>	
        </dl>
        <dl>

        	<dt><label for="logo">Logo (URL):</label></dt>
            <dd><input name="logo" type="text" Manca solo qui e inserisci class="text"></dd>
        </dl>
        <dl>
<dt><label for="autore">Autore:</label></dt>
            <dd><input name="autore" type="text" Manca solo qui e inserisci class="text"></dd>
        </dl>

Naturalmente devi inserire solo il testo scritto in verde...

04-10-2009, 00.25.23

ok grazie! ma posso mettere più classi? ad esempio cosi

Codice PHP:


select.lista {height:21px; position:absolute; border:1px solid transparent;}
selectLeft.lista {float:left; width:3px; height:21px; background:url(img/select-left.png) no-repeat 0 0; vertical-align:middle;}
selectRight.lista {height:21px; width:auto; background:url(img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#fff; padding-left:3px; margin-left:3px;}
selectTarget.lista {position:absolute; background:none; margin-left:-13px; margin-top:18px; z-index:3; left:0; top:0; padding-bottom:13px;}
selectOptions.lista {position:relative; background:#707175; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; color:#fff; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;}

04-10-2009, 00.30.02

Leggiti questa mia guida, ti spiega passo passo la sintassi CSS e la sua semantica: COSA SONO I CSS?

05-10-2009, 22.21.27

mmm...ho letto ma, se io faccio cosi

Codice PHP:


select {height:21px; position:absolute; border:1px solid transparent;}
.selectLeft {float:left; width:3px; height:21px; background:url(img/select-left.png) no-repeat 0 0; vertical-align:middle;}
.selectRight {height:21px; width:auto; background:url(img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#fff; padding-left:3px; margin-left:3px;}
.selectTarget {position:absolute; background:none; margin-left:-13px; margin-top:18px; z-index:3; left:0; top:0; padding-bottom:13px;}
.selectOptions {position:relative; background:#707175; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; color:#fff; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;}

mi basterà chiamare il primo selettore (select) con l'attributo class per poi visuliazzare anche gli altri selettori preceduti da punti, giusto?

05-10-2009, 22.33.39

Codice:

select {height:21px; position:absolute; border:1px solid transparent;}
select .Left {float:left; width:3px; height:21px; background:url(img/select-left.png) no-repeat 0 0; vertical-align:middle;}
select .Right {height:21px; width:auto; background:url(img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#fff; padding-left:3px; margin-left:3px;}
select .Target {position:absolute; background:none; margin-left:-13px; margin-top:18px; z-index:3; left:0; top:0; padding-bottom:13px;}
select .Options {position:relative; background:#707175; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; color:#fff; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;}

Per esempio:

Codice HTML:

<select class="Left" name=""><option value="">Opzione</option></select>

05-10-2009, 22.52.45

no, tutta deve essere una classe, in poche parole e come quando si fà un div come gli angoli arrotondati quelle immagini di background, sono in realta delle maschere per abbellisre il select...quindi io non devo visualizzare solamente il left ma anche il right ecc...

05-10-2009, 23.01.34

Quello che ti ho scritto in effetti è sbagliato. Quello che ho scritto dice: formatta così tutti gli elementi che hanno come classe .nome_classe.

Quindi dovresti fare così:

Codice:

select {height:21px; position:absolute; border:1px solid transparent;}
select.Left {float:left; width:3px; height:21px; background:url(img/select-left.png) no-repeat 0 0; vertical-align:middle;}
select.Right {height:21px; width:auto; background:url(img/select-right.png) no-repeat 100% 0; cursor:pointer; font:12px/21px Arial, Helvetica, sans-serif; color:#fff; padding-left:3px; margin-left:3px;}
select.Target {position:absolute; background:none; margin-left:-13px; margin-top:18px; z-index:3; left:0; top:0; padding-bottom:13px;}
select.Options {position:relative; background:#707175; margin-left:16px; margin-top:0; list-style:none; padding:4px 0; color:#fff; font:11px/13px Arial, Helvetica, sans-serif; z-index:4; max-height:200px; overflow-y:auto; overflow-x:hidden; left:0; top:0;}

Poi una di queste, ad esempio:

Codice HTML:

<select class="Left" name=""><option value="">Opzione</option></select>
<select class="Right" name=""><option value="">Opzione</option></select>
<select class="Options" name=""><option value="">Opzione</option></select>

e così via.

**andreafallico** · 05-10-2009, 23.12.31

Ma queste immagini esistono?
img/input.png
img/select-left.png
img/select-right.png
...e così via
perchè mi dice errore 404

Discussione: [CSS] Classi

LinkBack

Strumenti discussione

Display

[CSS] Classi

Regole di scrittura