Salve a tutti,

Ho creato una webapp in cui un web server fornisce ai client pagine jsp.
La pagina è molto semplice: ha solo 4 o 5 pulsanti e devono dividersi tutto lo schermo:

codice:
        <style type="text/css">

            .buttonStyle1 {
                background: #0000FE url(../images/1.png) center no-repeat;
                
                cursor:pointer;
                width: 95%;
                height: 20%;
            }
            
            .buttonStyle2 {
                background: #FFFF00 center no-repeat;
                background-image: url(../images/2.png);
                cursor:pointer;
                width: 95%;
                height: 20%;
            }
            
            .buttonStyle3 {
                background: #FE80FE url(../images/3.png) center no-repeat;
                cursor:pointer;
                width: 95%;
                height: 20%;
            }
            
            .buttonStyle4 {
                background: #FE0000 url(../images/4.png) center no-repeat;
                cursor:pointer;
                width: 95%;
                height: 20%;
            }
            
            .buttonStyle5 {
                background: #A806A9 url(../images/5.png) center no-repeat;
                cursor:pointer;
                width:95%;
                height: 20%;
            }
        </style>
e questo è un esempio di un bottone:
codice:
<body style="background-color:black; height: 95%;width: 95%;"       onload="setTimeout(function() { window.scrollTo(0, 1) }, 100);">
    
    <center> 
    <form name="b1" method="POST" width="50%" action="Classe">
    <input value=" " name="r1" type="image" class="buttonStyle1"/>
    <input value="49" name="val" type="hidden" />
    </form>

Il problema è questo: su tutti i cellulari si vede bene mentre sui Nokia la visualizzazione è diversa, esempio i pulsanti non occupano tutto lo schermo ma solo la metà ( quindi si dividono equamente lo spazio ma solo della metà dello schermo ).

Mi potete aiutare? grazie in anticipo