Problema con piu bottoni con classi diverse
Salve a tutti,
ho problemi nel gestire piu bottoni nella stessa pagina con classi diverse... Per necessità gestisco circa una 20ina di bottoni con annessi link... Ho creato per ogni tasto una sottoclasse(allego css):
Codice:
@charset "utf-8";
/* CSS Document */
<style type="text/css">
body { background-image: url(sfondo1.jpg);
background-repeat: repeat-x;
}
* { font-family:Arial; }
h2 { padding:0 0 5px 5px; }
h2 a { color: #224f99; }
a { color:#999; text-decoration: none; }
a:hover { color:#802727; }
p { padding:0 0 5px 0; }
input { padding:5px; border:1px solid #999; border-radius:4px; -moz-border-radius:4px; -web-kit-border-radius:4px; -khtml-border-radius:4px; }
.cercafidelity {
background-color: #F0F ; font-family: verdana; font-size:10px; width:250px ; height: 30 px
}
.usapunti {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.anagraficacard {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.logout {
background-color: #F0F ; font-family: verdana; font-size:10px; width:100px ; height: 30 px
}
.turni {
background-color: #F0F ; font-family: verdana; font-size:10px; width:100px ; height: 30 px
}
.appunti {
background-color: #F0F ; font-family: verdana; font-size:10px; width:100px ; height: 30 px
}
.areasuper {
background-color: #F0F ; font-family: verdana; font-size:10px; width:250px ; height: 30 px
}
.acconto {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.creafattura {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.resoart {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.buonoreso {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.rubricaforn {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.rubricaclienti {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.buonoregalo {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.assistenza {
background-color: #F0F ; font-family: verdana; font-size:10px; width:121px ; height: 30 px
}
.cercaarticolo {
background-color: #F45 ; font-family: verdana; font-size:10px; width:130px ; height: 60 px
}
.buono {
background-color: #F0F ; font-family: verdana; font-size:10px; width:250px ; height: 30 px
}
.tastobuoni {
background-color: #F0F ; font-family: verdana; font-size:10px; width:250px ; height: 120 px;
}
.visto{
width: 40px;
height: 40px;
background-image: url('visto.png');
background-repeat: no-repeat;
background-position: center;
}
.barcode {
height: 30px;
width: 140px;
}
</style>
Ma quando per esempio (come vedete dal codice css) vado a richiamare i tasti "tastobuoni" o "cercaarticolo" mi rimangono identici agli altri, anche cambiando gli attributi width e height...
Il codice per richiamarli è questo :
Codice HTML:
<input type="button" onClick="window.open('puntifidelity.htm', 'Cerca card', 'width=690, height=700, resizable, status, scrollbars=1, location');"
value="BUONO 100€" class="tastobuoni">
Non riesco a venirne a capo.. Potete aiutarmi?