Dimensionare i pulsanti

seabird

Dimensionare i pulsanti

Salve a tutti,

vorrei utilizzare dei pulsanti tipo questi:

e vorrei cercare di farceli stare tutti in un'unica riga.

Ma come si fa ridimensionarli, per non spreccare spazio prezioso, tra l'inizio (o la fine) del nome del pulsante e l'inizio (o la fine) del bordo del pulsante?

Io uso FrontPage, riducco i pulsanti al minimo, ma poi quando vado a vedere l'anteprima, lo spazio occupato è sempre lo stesso.

Come diavolo posso fare????????:?:?:?:?

oliviero

Ciao Seabird.
Io utilizzo un altro programma per i siti web, ma penso che possa anche dipendere dalla dimensione dello shermo del pc.
Oppure puoi provare a diminuire la dimensione del carattere, dato che non vedo altra soluione.
Ciao, oliviero

seabird

Ciao Oliviero.

Io non vorrei ridurre le dimensioni dei caratteri. Io vorrei ridurre al minimo lo spazio tra il bordo verticale del pulsante e il primo (o l'ultimo) carattere.

Ma come si fa? Io pensavo fosse una cosa elementare, ma non ci riesco.

ilprimore

<table border="0" width="1043">
<tr>
<td width="1035"><input type="button" value="Il Bed & Breakfast" style="background-color: #9841C2; color: #FFFFFF; font-weight: bold; height: 23; width: 130; border-style: ridge">
<input type="button" value="Dove mangiare" style="background-color:; color:; font-weight: bold; width: 121; height: 24; border-style: ridge">
<input type="button" value="Utilità" style="background-color:; color:; font-weight: bold; width: 55; height: 24; border-style: ridge">
<input type="button" value="Altro" style="background-color:; color:; font-weight: bold; width: 52; height: 24; border-style: ridge">
<input type="button" value="Da visitare" style="background-color:; color:; font-weight: bold; width: 89; height: 24; border-style: ridge">
<input type="button" value="Il Mare" style="background-color:; color:; font-weight: bold; width: 64; height: 24; border-style: ridge">
<input type="button" value="Come arrivare" style="background-color:; color:; font-weight: bold; width: 113; height: 24; border-style: ridge">
<input type="button" value="Altre mete Sarde" style="background-color:; color:; font-weight: bold; width: 131; height: 24; border-style: ridge">
<input type="button" value="Visualizza tutto" style="background-color:; color:; font-weight: bold; width: 114; height: 24; border-style: ridge">
<input type="button" value="Cancella tutto" style="background-color:; color:; font-weight: bold; width: 108; height: 24; border-style: ridge"></td>
</tr>
</table>sinceramente non sò se può funzionare, ma prova a diminuire i numeri alla voce "height", tipo così

poi fammi sapere se funziona, ciao.

seabird

Ciao ilprimore.

No, no, macchè. Quello è il primo tentativo che ho fatto, ma non funziona assolutamente. Non so se possa funzionare cambiando anche qualche altra cosa. Ma da solo non funziona.

Per ora ho risolto il problema usando una menu-bar in javascript, che è facilmente personalizzabile a proprio piacere. Ma in futuro, se vorrò usare uno di quei pulsanti, non saprò come dimensionarli.

seabird

Non c'è nessuno che mi sappia aiutare?

Io pensavo che fosse una cosa semplicissima. O no?

jantima

Ciao Seabird, ho messo margin e padding a zero pixel, ma quello che ti toglie il bordo ai lati delle scrittè dipende dal width che assegni ad ogni bottone, li ho ristretti un pochino, guarda se ti va bene.


<table border="0">
<tr>
<td ><input type="button" value="Il Bed & Breakfast" style="background-color: #9841C2; color: #FFFFFF; font-weight: bold; height: 23; width: 130; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Dove mangiare" style="background-color:; color:; font-weight: bold; width: 108; height: 24; border-style: ridge;padding:0px;margin:0px;;padding:0px;margin:0px;">
<input type="button" value="Utilit&agrave;" style="background-color:; color:; font-weight: bold; width: 50; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Altro" style="background-color:; color:; font-weight: bold; width: 45; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Da visitare" style="background-color:; color:; font-weight: bold; width: 80; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Il Mare" style="background-color:; color:; font-weight: bold; width: 54; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Come arrivare" style="background-color:; color:; font-weight: bold; width: 105; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Altre mete Sarde" style="background-color:; color:; font-weight: bold; width: 121; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Visualizza tutto" style="background-color:; color:; font-weight: bold; width: 111; height: 24; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Cancella tutto" style="background-color:; color:; font-weight: bold; width: 100; height: 24; border-style: ridge;padding:0px;margin:0px;"></td>
</tr>
</table>

seabird

Ciao Jantima.

Ok. Però guarda qui http://www.mracciu.altervista.org/example1.htm. Ho messo in tutti i pulsanti WIDTH=10. Però non è servito a niente.
Sai dirmi perchè?

jantima

Io non vedo nessun width assegnato a quei pulsanti, io vedo qusto codice:


<table border="0"> <tbody><tr> <td>
<input value="Il Bed &amp; Breakfast" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button">
<input value="Dove mangiare" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Utilità" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Altro" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Da visitare" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Il Mare" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Come arrivare" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Altre mete Sarde" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Visualizza tutto" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button"> 
<input value="Cancella tutto" style="border-style: ridge; margin: 0px; padding: 0px; background-color: rgb(152, 65, 194); color: rgb(255, 255, 255); font-weight: bold;" type="button">
</td> </tr> </tbody></table>

Posso anche dirti che con IE ha tanto spazio laterale tra il testo e il bordo del bottoni, ma che su FireFox i bottoni sono stretti, giusto il minimo per contentere il testo.

seabird

Come non vedi nessun WIDTH?

E dove l'hai preso quel codice?

Il codice dei pulsanti è questo

<table border="0"> <tr> <td >
<input type="button" value="Il Bed & Breakfast" style="background-color: #9841C2; color: #FFFFFF; font-weight: bold; height: 23; width: 10; border-style: ridge;padding:0px;margin:0px;">
<input type="button" value="Dove mangiare" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;;padding:0px;margin:0px;"> 
<input type="button" value="Utilit&agrave;" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Altro" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Da visitare" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Il Mare" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Come arrivare" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Altre mete Sarde" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Visualizza tutto" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;"> 
<input type="button" value="Cancella tutto" style="background-color:; color:; font-weight: bold; width: 10; height: 24; border-style: ridge;padding:0px;margin:0px;">
</td> </tr> </table>

Tutti hanno WIDTH: 10

seabird

Finalmente ho capito (si fa per dire).

Manca px. Se scrivo WIDTH: 10PX i pulsanti vengono dimensionati giustamente.

Senza px, il dimensionamento a volte funziona, altre volte non funziona. Che strano!

Comunque ora so come fare.

Grazie Jantima!

jantima

Ciao, si infatti spesso bisogna mettere px altrimenti potrebbe non funzionare su certi browser o per certe cose, non ci avevo pensato li per li.
Per la cosa del codice, mi capita quando uso firefox e seleziono una parte (nel tuo caso i bottoni) e faccio visualizza sorgente selezione, e il width non c'è. Strano, se faccio sorgente di tutta la pagina infatti vedo il width=10.