salve, uso questo codice
http://cssdeck.com/labs/css-checkbox-styles
per cambiare un po' lo stile delle checkbox (nel link uso l'ultimo esempio).
Come vedete dal codice postato qui però ho bisogno di avere una label alla checkbox, e non posso usare propriamente il tag label perché in quel codice la vera checkbox è nascosta e la label è resa come checkbox.
In pratica: come posso aggiungere del testo descrittivo? ho provato ad aggiungerlo all'interno di <label>, ma l'attributo width:20px è un problema: ho bisogno di width:200px di spazio per il testo

codice:
<div id="legend">       <li class="check">            <input type="checkbox" value="None" id="check1"onclick="" name="check" />
    <label for="check1"></label><a onclick="" href="#">LABEL</a>
       </li></div>
codice:
#legend input[type=checkbox] {
    visibility: hidden;
}
#legend .check label span{
margin-left: 20px;
display: block;
}
#legend .check{position: relative;}
#legend .check label {
    cursor: pointer;
    position: absolute;
    width: 15px;
    height: 15px;
    top: 7px;
    left:0;
    border-radius:10px;
    -webkit-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
    -moz-box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
    box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);
    background: #fcfff4;


}
#legend .check label[for='check1']{background:#428BCA}
#legend .check label:after {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    filter: alpha(opacity=0);
    opacity: 0;
    content: '';
    position: absolute;
    width: 9px;
    height: 5px;
    background: transparent;
    top: 4px;
    left: 4px;
    border: 3px solid #333;
    border-top: none;
    border-right: none;


    -webkit-transform: rotate(-45deg);
    -moz-transform: rotate(-45deg);
    -o-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg);
}


#legend .check label:hover::after {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=30)";
    filter: alpha(opacity=30);
    opacity: 0.5;
}


#legend .check input[type=checkbox]:checked + label:after {
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    filter: alpha(opacity=100);
    opacity: 1;
}