WebSite X5Help Center

 
Danilo R.
Danilo R.
User

Pulsante CSS a dimensione fissa  it

Автор: Danilo R.
Просмотрено 2058, Подписчики 1, Размещенный 0  

Buonasera, ho un pulsante CSS per il sito, chiedo quale stringa devo inserire perchè la dimensione non sia variabile in funzione della lunghezza del testo.

questo è lo style:

.btngrigiopromo{text-decoration:none; text-align:left;
 padding:12px 70px;
 border:none;
 -webkit-border-radius:4px;
 -moz-border-radius:4px;
 border-radius: 4px;
 font:14px Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#000000;
 background-color:#e1e1e1 ;
 background-image: -moz-linear-gradient(top, #ffffff 0%, #e1e1e1 e1e1e1  100%);
 background-image: -webkit-linear-gradient(top, #ffffff 0%, #e1e1e1  100%);
 background-image: -o-linear-gradient(top, #ffffff 0%, #e1e1e1  100%);
 background-image: -ms-linear-gradient(top, #ffffff 0% ,#e1e1e1  100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1982A5', endColorstr='#1982A5',GradientType=0 );
 background-image: linear-gradient(top, #ffffff 0% ,#e1e1e1  100%);  
 -webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
 -moz-box-shadow: 0px 0px 2px #bababa,  inset 0px 0px 1px #ffffff; 
 box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff; 
 
  }.btngrigiopromo:hover{
 padding:12px 70px;
 border:none;
 -webkit-border-radius:4px;
 -moz-border-radius:4px;
 border-radius: 4px;
 font:14px Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#000000;
 background-color:#e1e1e1 ;
 background-image: -moz-linear-gradient(top, #e1e1e1  0%, #c9c9c9 100%);
 background-image: -webkit-linear-gradient(top, #e1e1e1 0%, #c9c9c9 100%);
 background-image: -o-linear-gradient(top, #e1e1e1  0%, #c9c9c9  100%);
 background-image: -ms-linear-gradient(top, #e1e1e1   0% ,#c9c9c9 100%);
 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#1982A5', endColorstr='#1982A5',GradientType=0 );
 background-image: linear-gradient(top, #e1e1e1  0% ,#c9c9c9  100%);  
 -webkit-box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff;
 -moz-box-shadow: 0px 0px 2px #bababa,  inset 0px 0px 1px #ffffff; 
 box-shadow:0px 0px 2px #bababa, inset 0px 0px 1px #ffffff; 
 }

Grazie mille.

Размещено
19 Ответы - 3 Полезно
Danilo R.
Danilo R.
User
Автор

Aggiungo, e allineare il testo a sinistra?

Читать больше
Размещено От Danilo R.
 lemonsong  
 lemonsong  
User

Su che tipo di elemento agisce quel CSS?

Un link da vedere TI aiuterebbe.

Comunque, se fosse un elemento di blocco, puoi azzerare il padding laterale destro ed assegnare una larghezza (width).

In allegato un esempio.

Читать больше
Размещено От  lemonsong  
Danilo R.
Danilo R.
User
Автор

I pulsanti agiscono su questi elementi:

<a href="#" class="btnpromo"/>Richiedi informazioni</a>

<a href="#" class="btngrigiopromo"/>Dettagli Volkswagen Nuova Polo</a>

Quì c'è un esempio in quanto il mio sito lo devo ancora pubblicare in quanto devo completare i collegamenti, colori e sfumature sono a posto ma a volte i testi pussono essere più lunghi o corti de devo sempre agire mettendo spazi dopo il testo.

http://www.carnevalicars.it/vw/Gamma/Promo/Nuova-polo

Grazie

Читать больше
Размещено От Danilo R.
Danilo R.
Danilo R.
User
Автор

Dimenticavo una cosa, ho anche la freccina che c'è prima del testo ma non riesco ad inserirla.

Читать больше
Размещено От Danilo R.
 lemonsong  
 lemonsong  
User
Danilo R.
Quì c'è un esempio in quanto il mio sito lo devo ancora pubblicare [...]

Mah, se vuoi un copia/incolla del pulsante presente in quel sito, trovi HTML e CSS nell'allegato.

Mi sembra di aver preso tutto, forse troppo... vedi tu.

La freccia ha un percorso assoluto, scaricala ed inseriscila con percorso relativo.

Читать больше
Размещено От  lemonsong  
Danilo R.
Danilo R.
User
Автор

Tutto bene, ho messo tutto il "css" nella proprietà e come "class" metto il pulsante di cui ho bisogno nelle varie pagine cambiando dimensione e colori, ma ho un problema, pur avendo messo il percorso assoluto per la freccina non le mette:

.button-big.promo a:hover {
    background-image: url(http://i1162.photobucket.com/albums/q524/dani0548/dark_btn_bigarrow_zpsbe15e8e5.png);
    background-repeat: no-repeat;
    background-position: left center;
    text-decoration: none;

Ho pubblicato il sito con i bottoni provvisori con lo style provvisorio di inizio pagina:

http://www.fabiocorradi.it/promo-golf-variant.html

http://www.fabiocorradi.it/gamma-up.html

Poi dovremmo studiare (dico dovremmo perchè siete sempre gentili e disponibili) qesto menù verticale con le freccine ce resti evidenziata la pagina che sto visitando.

http://www.carnevalicars.it/vw/Gamma/Up (nel mio l'ho fatto con un file di testo).

Grazie di tutto.

ps: tutte queste domande perchè mi manca una certa conoscenza della materia ma impegnandomi e con il vostro aiuto qualcosa di buono combino

Читать больше
Размещено От Danilo R.
Danilo R.
Danilo R.
User
Автор

L'immagine allegata è relativa al nuovo style pulsante_vw.txt.

Читать больше
Размещено От Danilo R.
Mirko Boschetti
Mirko Boschetti
Moderator

Volendo, senza tanti codici, potevi inserire delle semplici immagini con testo incorporato, ed effetto rollover da programma....

Читать больше
Размещено От Mirko Boschetti
Mirko Boschetti
Mirko Boschetti
Moderator

Comunque, stai facendo davvero un bel sito...complimenti...  

Читать больше
Размещено От Mirko Boschetti
Danilo R.
Danilo R.
User
Автор

Il sito è dell'azienda di mia figlia e cosa non si fa per fargli risparmiare (con i tempi che corrono). In questo sito c'è anche una parte di voi è di questo vi ringrazio tanto (i pulsanti menu' principale sono tuoi Mirko), per quanto riguarda la struttura principale (pulsanti e varie) preferisco (con il vostro aiuto) farli con css.

grazie.

Читать больше
Размещено От Danilo R.
Danilo R.
Danilo R.
User
Автор

Finalmente funziona tutto, come ultimo chiedo se è possibile darmi una mano a copiare questo menu verticale (lemonsong):

http://www.carnevalicars.it/vw/Gamma/Up

Grazie ancora

Читать больше
Размещено От Danilo R.
 lemonsong  
 lemonsong  
User

Se ho capito bene a quale menu ti riferisci, si può fare uguale da programma (Menu di Pagina).

Читать больше
Размещено От  lemonsong  
Danilo R.
Danilo R.
User
Автор

Ma il problema che lo devo mettere solo in determinate pagine.

Читать больше
Размещено От Danilo R.
 lemonsong  
 lemonsong  
User
La Guida
I Menu di Pagina sono quelli che, opzionalmente, possono essere visualizzati per proporre l'elenco delle Pagine del Livello corrente. In altre parole, se si apre una Pagina che appartiene a un Livello e questo Livello contiene anche altre Pagine, il Menu di Pagina propone l'elenco di tutte le Pagine di tale Livello. I Menu di Pagina vengono sempre proposti come menu verticali, posizionati a destra o a sinistra dei contenuti di Pagina.
Читать больше
Размещено От  lemonsong  
Danilo R.
Danilo R.
User
Автор

Tutto ok e sto procedendo benissimo. Un ultima cosa (spero sia ultima) nei pulsanti pur avendo un carattere speciale (VWHeadlineOTSemibold) che in origine nella cartella caratteri  è scritto così "VW Headline OT Semibold" usa sempre il carattere "Arial" nei pulsanti?

Grazie ancora.

X

Читать больше
Размещено От Danilo R.
 lemonsong  
 lemonsong  
User

Se vuoi inserire un font particolare, leggi la guida e scrivi la font-family giusta nel CSS del pulsante.

Читать больше
Размещено От  lemonsong  
Danilo R.
Danilo R.
User
Автор

Scusa sembra sistemato così:

"VW Headline OT-Semibold" nel foglio di stile.

X

Читать больше
Размещено От Danilo R.
Danilo R.
Danilo R.
User
Автор

Ho una domanda per lemonsong (che già mi aveva risolto per un'altro sito). Ho un menù nel quale deve essere attivo nella pagina che sto visitando come questo esempio:

http://www.carnevalicars.it/vw/Service-Promozioni (quello sotto l'immagine promozioni), allego il txt.

Читать больше
Размещено От Danilo R.
Danilo R.
Danilo R.
User
Автор

Risolto, il problema stava qui: "class="selected" 

Читать больше
Размещено От Danilo R.